1.安裝vue-cli 3.0
npm install -g @vue/cli
# or
yarn globaladd @vue/cli
安裝成功后查看版本：vue -V(大寫的V)
2.命令變化
vue create --help
用法：create [options] <app-name>
創(chuàng)建一個由 `vue-cli-service` 提供支持的新項(xiàng)目
選項(xiàng)：
? -p, --preset <presetName>? ? ? 忽略提示符并使用已保存的或遠(yuǎn)程的預(yù)設(shè)選項(xiàng)
? -d, --default? ? ? ? ? ? ? ? ? 忽略提示符并使用默認(rèn)預(yù)設(shè)選項(xiàng)
? -i, --inlinePreset <json>? ? ? 忽略提示符并使用內(nèi)聯(lián)的 JSON 字符串預(yù)設(shè)選項(xiàng)
? -m, --packageManager <command>? 在安裝依賴時使用指定的 npm 客戶端
? -r, --registry <url>? ? ? ? ? ? 在安裝依賴時使用指定的 npm registry (僅用于 npm 客戶端)
? -g, --git [message]? ? ? ? ? ? 強(qiáng)制 / 跳過 git 初始化，并可選的指定初始化提交信息
? -n, --no-git? ? ? ? ? ? ? ? ? ? 跳過 git 初始化
? -f, --force? ? ? ? ? ? ? ? ? ? 覆寫目標(biāo)目錄可能存在的配置
? -c, --clone? ? ? ? ? ? ? ? ? ? 使用 git clone 獲取遠(yuǎn)程預(yù)設(shè)選項(xiàng)
? -x, --proxy? ? ? ? ? ? ? ? ? ? 使用指定的代理創(chuàng)建項(xiàng)目
? -b, --bare? ? ? ? ? ? ? ? ? ? ? 創(chuàng)建項(xiàng)目時省略默認(rèn)組件中的新手指導(dǎo)信息
? -h, --help? ? ? ? ? ? ? ? ? ? ? 輸出使用幫助信息
3.創(chuàng)建項(xiàng)目
去到指定目錄下創(chuàng)建項(xiàng)目（project-name：項(xiàng)目名稱）
vue create project-name
my-default 是 我原來保存好的模板；
default 是 使用默認(rèn)配置
Manually select features 是 自定義配置
4.選擇配置（自定義配置）
5.選擇css預(yù)編譯，這里我選擇less
? Please pick a preset: Manuallyselect features? Check the features neededforyour project: Router, Vuex, CSS Pre-processors, Linter, Unit? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported bydefault):
? SCSS/SASS
? > LESS
? Stylus
6.語法檢測工具，這里我選擇ESLint + Standard config
? Please pick a preset: Manuallyselect features? Check the features neededforyour project: Router, Vuex, CSS Pre-processors, Linter, Unit? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported bydefault): Stylus? Pick a linter / formatter config: (Use arrow keys)
? ESLint with error prevention only
? ESLint + Airbnb config
> ESLint + Standard config
? ESLint + Prettier
7.選擇語法檢查方式，這里我選擇保存就檢測
? Please pick a preset: Manuallyselect features? Check the features neededforyour project: Router, Vuex, CSS Pre-processors, Linter, Unit
? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported bydefault): Stylus
? Pick a linter / formatter config: Prettier
? Pick additional lint features: (Press toselect, to toggle all, to invert selection)
>( ) Lint on save? ? ? ? ? ? ? ? ? ? ?// 保存就檢測
( ) Lint and fix on commit? ? ? ?// fix和commit時候檢查
8.接下來會問你把babel,postcss,eslint這些配置文件放哪，這里隨便選，我選擇放在獨(dú)立文件夾
? Please pick a preset: Manuallyselect features
? Check the features neededforyour project: Router, Vuex, CSS Pre-processors, Linter, Unit
? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported bydefault): Stylus
? Pick a linter / formatter config: Prettier
? Pick additional lint features: Lint on save
? Pick a unit testing solution: Jest? Wheredoyou prefer placing configforBabel, PostCSS, ESLint, etc.
? (Use arrow keys)
> In dedicated config files// 獨(dú)立文件放置
In package.json// 放package.json里
9.鍵入N不記錄，如果鍵入Y需要輸入保存名字，如第一步所看到的我保存的名字為my-default
? Please pick a preset: Manuallyselect features
? Check the features neededforyour project: Router, Vuex, CSS Pre-processors, Linter, Unit
? Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported bydefault): Stylus
? Pick a linter / formatter config: Prettier
? Pick additional lint features: Lint on save
? Pick a unit testing solution: Jest
? Wheredoyou prefer placing configforBabel, PostCSS, ESLint, etc.
? In dedicated config files
? Savethisasa presetforfuture projects? (Y/n)// 是否記錄一下以便下次繼續(xù)使用這套配置。
10.確定后，等待下載依賴模塊
11.項(xiàng)目創(chuàng)建好后
cd project-name// 進(jìn)入項(xiàng)目根目錄run serve// 運(yùn)行項(xiàng)目
12.瀏覽器打開? http://localhost:8080?
