前期準備：搭建項目之前，請確認好你自己已經(jīng)安裝過node, npm, vue cli。
1.node -v? 查看node 的版本號
2.npm -v? ?查看npm 版本號
3. 查看 vue-cli 的版本? vue-V
環(huán)境全部準備完成，開始我們的正式項目構(gòu)建～～～～ 上車??！
1.進入一個目錄，創(chuàng)建項目
?對應(yīng)命令：
vue create vue-pages
2.我們這里選擇手動配置
按?↓?選擇“Manually select features”，再按?Enter
?3.選擇你需要的配置項
通過↑ ↓ 箭頭選擇你要配置的項，按 空格 是選中，按 a 是全選，按 i 是反選。具體每個配置項表示什么意思在下面會有說明。
( ) Choose Vue version? ? ? // 選擇Vue版本
( )??Babel? ?//??vue項目中普遍使用es6語法，但有時我們的項目需要兼容低版本瀏覽器，這時就需要引入babel插件，將es6轉(zhuǎn)成es5
( ) TypeScript? ?// typeScript通過添加類型來擴展JavaScript。通過了解JavaScript，TypeScript可以節(jié)省您捕獲錯誤的時間并在運行代碼之前提供修復(fù)。任何瀏覽器，任何操作系統(tǒng)，任何運行JavaScript的地方。 完全開源
( ) Progressive Web App (PWA) Support// 漸進式Web應(yīng)用程序
( ) Router // vue-router（vue路由）
( ) Vuex // vuex（vue的狀態(tài)管理模式）
( ) CSS Pre-processors // CSS 預(yù)處理器（如：less、sass）
( ) Linter / Formatter // 代碼風(fēng)格檢查和格式化（如：ESlint）
( ) Unit Testing // 單元測試（unit tests）
( ) E2E Testing // e2e（endtoend） 測試選擇你的vue 版本：??
3.1?選擇是否使用history router
?Vue-Router 利用了瀏覽器自身的hash 模式和 history 模式的特性來實現(xiàn)前端路由（通過調(diào)用瀏覽器提供的接口）。
我這里建議選n。這樣打包出來丟到服務(wù)器上可以直接使用了，后期要用的話，也可以自己再開起來。
選yes的話需要服務(wù)器那邊再進行設(shè)置。
Use history mode for router? (Requires proper server setup for index fallback in production)
3.2?選擇css?預(yù)處理器
我選擇的是Sass/Scss(with dart-sass)?
node-sass是自動編譯實時的，dart-sass需要保存后才會生效。sass 官方目前主力推dart-sass?最新的特性都會在這個上面先實現(xiàn)。
3.3?選擇Eslint代碼驗證規(guī)則
提供一個插件化的javascript代碼檢測工具，ESLint + Prettier //使用較多
ESLint with error prevention only 只配置使用 ESLint 官網(wǎng)的推薦規(guī)則 這些規(guī)則在這里添加鏈接描述
ESLint + Airbnb config 使用 ESLint 官網(wǎng)推薦的規(guī)則 + Airbnb 第三方的配置 Airbnb
的規(guī)則在這里添加鏈接描述 ESLint + Standard config 使用 ESLint 官網(wǎng)推薦的規(guī)則 + Standard
第三方的配置 Standard 的規(guī)則在這里 添加鏈接描述 ESLint + Prettier 使用 ESLint 官網(wǎng)推薦的規(guī)則 +
3.4?選擇什么時候進行代碼規(guī)則檢測
( ) Lint on save // 保存就檢測
( ) Lint and fix on commit // fix和commit時候檢查
建議選擇保存就檢測，等到commit的時候，問題可能都已經(jīng)積累很多了。
3.5?選擇單元測試
> Mocha + Chai //mocha靈活,只提供簡單的測試結(jié)構(gòu)，如果需要其他功能需要添加其他庫/插件完成。必須在全局環(huán)境中安裝
Jest //安裝配置簡單，容易上手。內(nèi)置Istanbul，可以查看到測試覆蓋率，相較于Mocha:配置簡潔、測試代碼簡潔、易于和babel集成、內(nèi)置豐富的expect
3.6?選擇如何存放配置
>Indedicated config files // 獨立文件放置
? Inpackage.json // 放package.json里
如果是選擇?獨立文件放置，項目會有單獨如下圖所示的幾件文件。
3.7?是否保存當(dāng)前配置
鍵入N不記錄，如果鍵入Y需要輸入保存名字，如第2步所看到的我保存的名字為yemeier。
4.等待創(chuàng)建項目
5.執(zhí)行它給出的命令，cd 到目錄下
cd vue-pages
npm run serve
