- 快速創建工程的兩種方法
- 工程化項目的目錄
我這裏的node與npm的版本如下:
安裝vue-cli腳手架
全局安裝vue-cli腳手架可使用命令:npm install -g @vue/cli或者cnpm install -g @vue/cli
如何創建一個vue工程
- 進入創建工程的目錄
- 使用vue create 項目名創建一個工程
- 也可以使用vue ui這個命令進行創建一個工程
項目名應該使用短橫線或者下橫線,小寫的英文字母
使用vue create創建一個工程
如果使用default模式,它就會創建一個默認選項的工程,這裏使用手動選擇功能
我的系統是win7,使用是cmd.exe命令行工具,因爲使用Git Bash Use arrow keys無法選擇
Babel:用來解析ES6語法
Router: 路由組件
Vuex: 狀態控制Vuex組件
CSS Pre-processors:CSS預編譯的組件
平時寫代碼的時候會有一些規則讓我們的代碼更優美,建議選擇Airbnb config或者Standard config,這裏選擇Airbnb config
這裏選擇的是: Lint on save
如果這裏選擇y,那麼今後創建的所有項目都會按照剛纔手動配置的這些選項去創建項目,這裏建議選擇N
創建項目的過程:
如果這裏創建的項目慢的話,可以按Ctrl+c終止,然後進入項目目錄,使用cnpm install命令進行安裝
項目創建成功,如下圖:
cd 到項目目錄,執行npm run serve,成功後如下:
使用vue ui命令創建一個工程
項目完成如下:
這裏可以看到我們安裝了哪些插件:
項目中的運行依賴、開發依賴:
CLI工具的配置: