一、安裝 vue-cli v3
二、快速原型開發(fā)
安裝vue-cli的全局?jǐn)U展
npm install -g @vue/cli-service-global
啟動(dòng)并打開瀏覽器
vue serve -o App.vue
build
vue App.vue
三霹粥、創(chuàng)建項(xiàng)目
vue create hello-world
tip: 可在選擇時(shí)preset時(shí)伦腐，選擇預(yù)置的babel赢底、vue-router、vuex等。
四幸冻、插件管理
安裝vue scope插件
vue add @vue/eslint
這相當(dāng)于：
vue add @vue/cli-plugin-eslint
安裝非vue scope插件：
# 安裝并調(diào)用 vue-cli-plugin-apollo
vue add apollo
兩個(gè)特殊插件：
vue add router
vue add vuex
五粹庞、啟動(dòng)，構(gòu)建及代碼檢查
@vue/vue-cli-service 洽损，它是工具
package.json中的片段：
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint"
},
重要參數(shù)：
- serve
用法：vue-cli-service serve [options] [entry]
選項(xiàng)：
--open 在服務(wù)器啟動(dòng)時(shí)打開瀏覽器
--copy 在服務(wù)器啟動(dòng)時(shí)將 URL 復(fù)制到剪切版
--mode 指定環(huán)境模式 (默認(rèn)值：development)
--host 指定 host (默認(rèn)值：0.0.0.0)
--port 指定 port (默認(rèn)值：8080)
--https 使用 https (默認(rèn)值：false)
- build
用法：vue-cli-service build [options] [entry|pattern]
選項(xiàng)：
--mode 指定環(huán)境模式 (默認(rèn)值：production)
--dest 指定輸出目錄 (默認(rèn)值：dist)
--modern 面向現(xiàn)代瀏覽器帶自動(dòng)回退地構(gòu)建應(yīng)用
--target app | lib | wc | wc-async (默認(rèn)值：app)
--name 庫或 Web Components 模式下的名字 (默認(rèn)值：package.json 中的 "name" 字段或入口文件名)
--no-clean 在構(gòu)建項(xiàng)目之前不清除目標(biāo)目錄
--report 生成 report.html 以幫助分析包內(nèi)容
--report-json 生成 report.json 以幫助分析包內(nèi)容
--watch 監(jiān)聽文件變化
