1.vue腳手架的使用需要node.js支持，所以需要下載安裝node.js ，可以到node.js官網(wǎng)下載node.js https://nodejs.org/zh-cn/,可以根據(jù)個(gè)人需要下載版本，推薦多數(shù)用戶使用（LTS）

2.安裝很簡(jiǎn)單，一串點(diǎn)點(diǎn)點(diǎn)下一步就完事了，安裝路徑根據(jù)自己愛喜好來(lái)設(shè)置

3.安裝完成后 win+R 輸入cmd 查看安裝版本

4.npm 安裝第三方包時(shí)速度過(guò)慢問(wèn)題 npm config set registry=http://registry.npm.taobao.org/

網(wǎng)上也看也有推薦使用安裝 cnmp npm install cnpm-g--registry=https://registry.npm.taobao.org 根據(jù)個(gè)人喜好選擇吧，第二種安裝成功率高，第二種就是把npm 替換成 cnpm使用

5 全局安裝 vue-cli ，在命令提示窗口執(zhí)行：npm install -g @vue/cli 或者第二種 cnpm install -g @vue/cli

到這里就恭喜你安裝成功了

6 vue -V 查看版本

7 現(xiàn)在開始通過(guò)腳手架創(chuàng)建項(xiàng)目，我把項(xiàng)目創(chuàng)建在E盤的test文件夾下，這里可以根據(jù)個(gè)人喜好存放位置，首先通過(guò)dos命令定位到該文件夾下

8 然后創(chuàng)建項(xiàng)目，vue create myvue 回車創(chuàng)建項(xiàng)目 myvue是項(xiàng)目名稱，可以自定義項(xiàng)目名字，然后開始進(jìn)入一系列問(wèn)答環(huán)節(jié) ，default是默認(rèn)配置，下面是手動(dòng)選擇配置我選擇第二種，向下的箭頭選中（上下箭頭切換）回車

9 babel:轉(zhuǎn)換es6語(yǔ)法的這個(gè)必須要，typescript暫時(shí)沒涉及到，router管理路由的也選上，vuex狀態(tài)管理就看自己需不需要用，css pre樣式預(yù)處理器這個(gè)也加上，linter/Formatter統(tǒng)一代碼風(fēng)格，最后2個(gè)分別是單元測(cè)試和端對(duì)端測(cè)試，一般不會(huì)用到

10接著問(wèn)答題來(lái)了：你的路由使用歷史模式嗎？ 路由模式分為Hash模式 History(歷史)模式 Abstract模式 三種 hash模式最明顯的特點(diǎn)就是url上會(huì)帶有#號(hào)， History歷史模式的url就跟正常的訪問(wèn)地址一樣，此處我選擇yes,

10.1下一步選擇css預(yù)處理器 我選的 sass/scsss

　 10.2選擇哪個(gè)自動(dòng)化代碼格式化檢測(cè) （語(yǔ)法檢測(cè)工具）就是可以檢測(cè)出你代碼中潛在的問(wèn)題，保證寫出的代碼語(yǔ)法正確，風(fēng)格統(tǒng)一。

ESLint with error prevention only(只檢測(cè)錯(cuò)誤) ESLint + Airbnb config 獨(dú)角獸公司的Airbnb，有人評(píng)價(jià)說(shuō)“這是一份最合理的javascript的編碼規(guī)范”它幾乎涵蓋了js的各個(gè)方面

ESLint + Standard config standardjs是一份強(qiáng)大的js編碼規(guī)范，自帶linter和自動(dòng)代碼糾正，沒有配置，自動(dòng)格式化代碼，可在編碼早起發(fā)現(xiàn)規(guī)范問(wèn)題和低級(jí)錯(cuò)誤

ESLint + Prettier Prettier 作為代碼格式化工具，能夠統(tǒng)一整個(gè)團(tuán)隊(duì)的代碼風(fēng)格 我選的ESLint + Standard config

10.3選擇語(yǔ)法檢查方式 Lint on save (保存就檢測(cè)) Lint and fex on commit ( 用戶提交文件到git的時(shí)候檢測(cè) )我選的Lint on save

10.4就是問(wèn)你babel,postcss,eslint這些配置文件放哪？// in dedicated config files（在專用配置文件中，就是單獨(dú)管理） in package.json（放在package.json里）我選的in dedicated config files

10.5是否將以上這些保存為未來(lái)項(xiàng)目的預(yù)配置？ //如果你選擇y那么下次搭建項(xiàng)目是就會(huì)出現(xiàn)你這一次配置的選項(xiàng)。 我選擇n

11安裝成功

項(xiàng)目目錄結(jié)構(gòu)

到此這篇關(guān)于vue-cli3腳手架安裝的文章就介紹到這了,更多相關(guān)vue-cli3腳手架安裝內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評(píng)論