ubuntu21.04(linux):安裝node(14.17.1)和vue.js3.1環境
阿新 • • 發佈:2021-06-21
一,下載node:
訪問:https://nodejs.org/en/如圖: 我們選擇lts版本下載
liuhongdi@lhdpc:/usr/local/source$ wget https://nodejs.org/dist/v14.17.1/node-v14.17.1-linux-x64.tar.xz解壓:
liuhongdi@lhdpc:/usr/local/source$ xz -d node-v14.17.1-linux-x64.tar.xz liuhongdi@lhdpc:/usr/local/source$ tar -xvf node-v14.17.1-linux-x64.tar
說明:劉巨集締的架構森林是一個專注架構的部落格,地址: https://www.cnblogs.com/architectforest
對應的原始碼可以訪問這裡獲取:https://github.com/liuhongdi/
說明:作者:劉巨集締 郵箱: [email protected]
二,安裝node
移動到軟體安裝目錄liuhongdi@lhdpc:/usr/local/source$ mv node-v14.17.1-linux-x64 /usr/local/soft/建立符號連結:
root@lhdpc:~# ln -s /usr/local/soft/node-v14.17.1-linux-x64/bin/node /usr/local/bin/node root@lhdpc:檢視效果:~# ln -s /usr/local/soft/node-v14.17.1-linux-x64/bin/npm /usr/local/bin/npm
liuhongdi@lhdpc:/usr/local/source$ node -v v14.17.1 liuhongdi@lhdpc:/usr/local/source$ npm -v 6.14.13
三,安裝cnpm
安裝liuhongdi@lhdpc:/usr/local/source$ npm install -g cnpm --registry=https://registry.npm.taobao.org建立符號連結
root@lhdpc:~# ln測試效果-s /usr/local/soft/node-v14.17.1-linux-x64/bin/cnpm /usr/local/bin/cnpm
root@lhdpc:~# cnpm -v cnpm@6.2.0 (/usr/local/soft/node-v14.17.1-linux-x64/lib/node_modules/cnpm/lib/parse_argv.js) npm@6.14.13 (/usr/local/soft/node-v14.17.1-linux-x64/lib/node_modules/cnpm/node_modules/npm/lib/npm.js) node@14.17.1 (/usr/local/soft/node-v14.17.1-linux-x64/bin/node) npminstall@3.28.0 (/usr/local/soft/node-v14.17.1-linux-x64/lib/node_modules/cnpm/node_modules/npminstall/lib/index.js) prefix=/usr/local/soft/node-v14.17.1-linux-x64 linux x64 5.11.0-18-generic registry=https://registry.nlark.com
四,安裝vue-cli
安裝liuhongdi@lhdpc:/usr/local/source$ npm install -g @vue/cli
建立符號連結
root@lhdpc:~# ln -s /usr/local/soft/node-v14.17.1-linux-x64/bin/vue /usr/local/bin/vue檢視檔案
root@lhdpc:~# whereis vue vue: /usr/local/bin/vue檢視版本
root@lhdpc:~# vue -V @vue/cli 4.5.13
五,建立一個vue.js專案:
建立專案vuedemo1liuhongdi@lhdpc:/data/vue$ vue create vuedemo1如圖: 選擇vue3後回車 按照提示進行操作:
liuhongdi@lhdpc:/data/vue$ cd vuedemo1/
liuhongdi@lhdpc:/data/vue/vuedemo1$ npm run serve
檢視vue.js的版本:
liuhongdi@lhdpc:/data/vue/vuedemo1$ npm list vue vuedemo1@0.1.0 /data/vue/vuedemo1 └── vue@3.1.1通過瀏覽器檢視專案效果
六,檢視linux版本:
liuhongdi@lhdpc:/data/vue/vuedemo1$ cat /etc/os-release NAME="Ubuntu" VERSION="21.04 (Hirsute Hippo)" ID=ubuntu ID_LIKE=debian PRETTY_NAME="Ubuntu 21.04" VERSION_ID="21.04" HOME_URL="https://www.ubuntu.com/" SUPPORT_URL="https://help.ubuntu.com/" BUG_REPORT_URL="https://bugs.launchpad.net/ubuntu/" PRIVACY_POLICY_URL="https://www.ubuntu.com/legal/terms-and-policies/privacy-policy" VERSION_CODENAME=hirsute UBUNTU_CODENAME=hirsute