第一步、安裝node.js環境
下載地址:
http://nodejs.cn/這裡可以看到它有兩個版本我們選擇使用LTS版本,也就是長期支持版本比較穩定
第二步、更改npm包管理時的global以及緩存的位置
安裝好之後,對npm安裝的全局模塊所在路徑以及緩存所在路徑,進行配置。
是因為以後執行類似:npm install express [-g](後面的可選參數-g,g代表global全局安裝的意思)的安裝語句時,會將安裝的模塊安裝到【C:\Users\用戶名\AppData\Roaming\npm】路徑中,佔C盤空間。
例如:小編希望將全模塊所在路徑和緩存路徑放在我node.js安裝的文件夾中,這裡小編的安裝文件夾是這個【D:\nodejs】你們自己的依據自己的真實路徑來,在【D:\nodejs】下
創建兩個文件夾【node_global】及【node_cache】
創建好了之後在CMD中運行以下命令:(更改npm安裝路徑)
<code>//先運行這個 npm config set prefix "D:\nodejs\node_global" //再運行 npm config set cache "D:\nodejs\node_cache"/<code>
第三步、我們在下載一個cnpm
以上命令執行完畢後接下來我們下載cnpm
因為npm安裝插件是從國外服務器下載,受網絡影響大,可能出現異常,
如果npm的服務器在中國就好了,所以我們的淘寶團隊幹了這事!
來自官網:“這是一個完整的npmjs.org鏡像,你可以用此代替官方版本(只讀),同步頻率目前為10分鐘一次以保證儘量與官方服務同步。”
安裝:
<code>npm install -g cnpm --registry=https://registry.npm.taobao.org/<code>
完成後 輸入 cnpm-v,可以查看當前cnpm的版本
好了,到了這裡node就暫時告一段落了。接下來安裝vue-cli
先確認是否安裝過,如果有可以通過:
<code>npm uninstall vue-cli -g //進行卸載/<code>
上面我們安裝了cnpm所以我們安裝vue-cli當然使用cnpm了
<code>cnpm install -g @vue/cli // 進行腳手架的安裝/<code>
或者有些有條件的小夥伴可以從國外的服務器來安裝
直接通過國外的npm安裝
<code>npm install -g @vue/cli //或者 yarn global add @vue/cli/<code>
安裝好了之後可以通過指令:vue -V 查看腳手架是否安裝成功(注意-v大寫)
<code>vue -V /<code>
第四步:通過腳手架創建項目
<code>vue create //項目名稱/<code>
第五步、運行項目:
輸入
<code>npm run serve //運行,通過瀏覽器訪問local地址。/<code>
第六步、編譯項目:
切換到項目文件夾下運行以下命令
<code>cnpm run build /<code>
好了,到了環境的安裝配置以及運行項目就完了,小夥伴們有什麼疑問歡迎在下方評論區提問哦