1.創(chuàng)建項(xiàng)目之前 可以先安裝vue-cli3腳手架 npm install -g @vue/cli
安裝vue-cli3腳手架
如果不放心 可以vue -V 查看安裝是否成功
查看版本
2.創(chuàng)建項(xiàng)目 vue create project（這里我選擇的是默認(rèn)設(shè)置锌介，文件也比較簡單拓售，一般項(xiàng)目中應(yīng)該選擇manually select features 我在下面的【補(bǔ)充】中有介紹）
創(chuàng)建項(xiàng)目
3.按提示運(yùn)行項(xiàng)目 npm run serve
項(xiàng)目運(yùn)行
得到網(wǎng)址
4.在瀏覽器中打開
在瀏覽器打開
【補(bǔ)充】
- 1模捂、使用視圖界面創(chuàng)建項(xiàng)目 vue ui
運(yùn)行vue ui
瀏覽器打開
-
2、設(shè)置自動打開
-
3当娱、這里創(chuàng)建的項(xiàng)目比較簡單，很多文件比如像router也沒有啊终，這是因?yàn)樵匍_始的時候沒有選擇 manually select features（手動選擇功能辈灼，我也是呼呼呼的就回車了规丽，哈哈哈，結(jié)果忘了選擇）
功能選項(xiàng)：按空格鍵 選中 和 不選中 （試了好一會才發(fā)現(xiàn)是這樣的啊撇贺，哈哈哈）
功能選項(xiàng)
是否設(shè)置路由為history模式
這里是詢問怎么存放babel,postcss,eslint等的配置文件
是否保存此次配置
【全選】
我們再來試試全選的情況
將所有選項(xiàng)都選擇上：
1.是否使用class風(fēng)格的組件語法赌莺？
如果選擇y，腳手架就會幫我們安裝以下組件
vue-class-component
vue-property-decorator
2.是否使用Babel為TypeScript做轉(zhuǎn)義松嘶？（如果想使用JavaScript編輯雄嚣，在安裝選項(xiàng)時不要選擇TypeScript）
3.這個是是否設(shè)置路由為history模式
4.選擇一種CSS預(yù)處理 （如果安裝Sass/Scss，本地需要預(yù)先安裝python）
5.選擇一種TypeScript格式化校驗(yàn)規(guī)則
6.選擇校驗(yàn)的時機(jī)
Lint on save 保存的時候校驗(yàn)
Lint and fix on commit 提交的時候校驗(yàn)
7.選擇一種單元測試方案
8.選擇一種E2E(端對端)測試方案（只在Chrome瀏覽器上測試）
9.這里是詢問怎么存放babel,postcss,eslint等的配置文件
In dedicated config files 單獨(dú)存放
In package.json 集成在package.json
10.是否保存為preset（預(yù)設(shè)項(xiàng)喘蟆，以后可以使用的,就不用像這樣再一步一步來）
11.給預(yù)置項(xiàng)起個名字
下次打開的時候就能看到你之前保存的預(yù)設(shè)項(xiàng)了
下次運(yùn)行項(xiàng)目時
參考網(wǎng)站http://www.reibang.com/p/fe331c42570f
https://www.cnblogs.com/adhehe/p/10184851.html
