什么是Vue CLI
如果你只是簡單寫幾個Vue的Demo程序, 那么你不需要Vue CLI.
如果你在開發(fā)大型項(xiàng)目, 那么你需要, 并且必然需要使用Vue CLI
使用Vue.js開發(fā)大型應(yīng)用時，我們需要考慮代碼目錄結(jié)構(gòu)、項(xiàng)目結(jié)構(gòu)和部署、熱加載、代碼單元測試等事情。
如果每個項(xiàng)目都要手動完成這些工作，那無以效率比較低效，所以通常我們會使用一些腳手架工具來幫助完成這些事情。
CLI是什么意思?
CLI是Command-Line Interface, 翻譯為命令行界面, 但是俗稱腳手架.
Vue CLI是一個官方發(fā)布 vue.js 項(xiàng)目腳手架
使用 vue-cli 可以快速搭建Vue開發(fā)環(huán)境以及對應(yīng)的webpack配置.
Vue CLI使用前提 - Node
安裝NodeJS
可以直接在官方網(wǎng)站中下載安裝.
網(wǎng)址: http://nodejs.cn/download/
檢測安裝的版本
默認(rèn)情況下自動安裝Node和NPM
Node環(huán)境要求8.9以上或者更高版本
下載好node之后，以管理員身份打開cmd管理工具，，輸入 node -v ，回車，查看node版本號，出現(xiàn)版本號則說明安裝成功
安裝淘寶npm鏡像
由于npm是國外的，使用起來比較慢，推薦使用淘寶的cnpm鏡像來安裝vue.
淘寶的cnpm命令管理工具可以代替默認(rèn)的npm管理工具。
Vue CLI使用前提 - Webpack
Vue.js官方腳手架工具就使用了webpack模板
對所有的資源會壓縮等優(yōu)化操作
它在開發(fā)過程中提供了一套完整的功能，能夠使得我們開發(fā)過程中變得高效。
Webpack的全局安裝
npm install webpack -g
全局vue-cli腳手架，
輸入命令：cnpm install -g @vue/cli ；
驗(yàn)證是否安裝成功，在命令輸入vue，出來vue的信息，及說明安裝成功；
注意：上面安裝的是Vue CLI3的版本，如果需要想按照Vue CLI2的方式初始化項(xiàng)目時不可以
Vue CLI2初始化項(xiàng)目
vue init webpack my-project
Vue CLI3初始化項(xiàng)目
vue create my-project
Vue CLI2詳解
初始化后會出現(xiàn)一些配置詢問命令 一般選擇為 yes no no no (可根據(jù)自己需求選擇)
目錄結(jié)構(gòu)詳解
修改配置：webpack.base.conf.js起別名
cli3詳解
vue-cli 3 與 2 版本有很大區(qū)別
vue-cli 3 是基于 webpack 4 打造，vue-cli 2 還是 webapck 3
vue-cli 3 的設(shè)計(jì)原則是“0配置”，移除的配置文件根目錄下的，build和config等目錄
vue-cli 3 提供了 vue ui 命令，提供了可視化配置，更加人性化
移除了static文件夾，新增了public文件夾，并且index.html移動到public中
1初始化項(xiàng)目
vue create my-project
選擇配置
目錄結(jié)構(gòu)詳解
vue ui 視圖查看配置
自定義配置：起別名
