Vue新手入門【搭建項目】
前言 : 一入IT深似苦，唯有代碼解憂愁；習得後端習前端，前後通吃可還行；
面試中經常出現這麼一段對話：
面試官 : 會前端麼?
我 : html、css、jquery、javascript有用過
面試官 : Vue有使用過麼？
我 : (此刻内心有些無語)
于是便入手了Vue，俗話說的好：技多不壓身(總有用到的時候)
1. Vue環境搭建
1.1安裝node.js
首先需要去NodeJS官網下載下傳并且安裝Node.js，如果不會安裝的童鞋，送你一個傳送門，安裝完成之後，打開cmd，輸入node -v 檢視node.js版本
注意：安裝好node.js之後npm自動就安裝好了，如果你需要全局使用的話，那麼需要配置一下環境變量
1.2安裝cnpm(因為npm是國外的，可能會導緻下載下傳依賴失敗，推薦使用國内淘寶的cnpm)
運作指令：cnpm install -g cnpm --registry=http://registry.npm.taobao.org (-g是全局安裝)
1.3安裝腳手架工具(@vue/cli GUI)
如果已經安裝vue-cli的話先解除安裝，執行指令：npm uninstall vue-cli -g
安裝@vue-cli，運作指令：cnpm install -g @vue/cli，安裝完成之後vue --version檢視版本資訊
順便提一下@vue/cli和vue-cli的差別：版本不一樣，前者版本比較高，後者是3.x之前的版本，@vue/cli自帶GUI(圖形化界面，3.0以上版本才有)(圖檔與指令相對應)
2. 建立Vue項目
前面環境都搭好了的話，直接開始初始化，初始化項目有很多種方式
vue-cli 2.x：vue init webpack 項目名
vue-cli 3.x：vue create 項目名，但是可以自由選擇配置
我們以3.x版本為例
注意：上下鍵進行選擇，空格選中，回車确定
第一步，選擇模闆
第二步，選擇項目配置
第三步，根據上面的配置進行進一步的選擇，完成之後，回車即開始建構項目
1 TypeScript
是否使用class風格的元件文法：Use class-style component syntax?
是否使用babel做轉義：Use Babel alongside TypeScript for auto-detected polyfills?
2. Router 路由管理器
路由使用曆史模式:Use history mode for router? (Requires proper server setup for index fallback in production)
3. CSS Pre-processors css預處理
選擇CSS 預處理類型:Pick a CSS pre-processor (PostCSS, Autoprefixer and CSS Modules are supported by default)
選項：
Less
Sass
Stylus
4. Linter / Formatter 代碼風格、格式校驗
選擇Linter / Formatter類型:Pick a linter / formatter config:
選項：
TSLint
ESLint with error prevention only 僅錯誤預防
ESLint + Airbnb config Airbnb配置
ESLint + Standard config 标準配置
ESLint + Prettier
選擇lint方式：Pick additional lint features
選項：
Lint on save 儲存時檢查
Lint and fix on commit 送出時檢查
5. Unit Testing 單元測試
選擇unit testing類型：Pick a unit testing solution: (Use arrow keys)
選項：
Mocha + Chai
Jest
6. E2E Testing E2E（End To End）即端對端測試
選擇E2E testing類型：Pick a E2E testing solution: (Use arrow keys)
選項：
Cypress (Chrome only)
Nightwatch (Selenium-based)
7. 選擇 Babel, PostCSS, ESLint 等自定義配置的存放位置
Where do you prefer placing config for Babel, PostCSS, ESLint, etc.?
選項：
In dedicated config files 在專用的配置檔案中
In package.json 在package.json
8. 将此作為将來項目的預置嗎？
Save this as a preset for future projects?
選項：
In dedicated config files 在專用的配置檔案中
In package.json 在package.json
9.儲存預設為模闆
Save preset as:
第四步，啟動項目
第五步，檢視網頁，能夠成功通路，那麼恭喜你，已經學會了搭建一個簡單的vue項目.
結束語 : 書山有路勤為徑，學海無涯苦作舟(共勉)；
(PS : 如果不對之處，還請多多指教，共同學習進步）