Node 版本要求：
Vue CLI 4.x 需要?Node.js?v8.9 或更高版本 (推薦 v10 以上)。
mac如何升級node:http://www.itdecent.cn/p/acd316dceeb8
一、安裝@vue/cli：
npm install -g @vue/cli
安裝完畢。
vue create tt-bank創(chuàng)建項目，在此我選擇vue3
報錯了啊啊啊，氣死了
解決：首先在訪達(dá)的“偏好設(shè)置”里面把當(dāng)前用戶的文件夾顯示出來，在Mac上要顯示默認(rèn)文件，需要按快捷鍵：command + shift + .找到 .vuerc文件，打開此文件useTaobaoRegistry 原先是true 改為false
然后vue create tt-bank重新創(chuàng)建。
成功啦，嘻嘻嘻，撒花兒??Successfully created project tt-bank.剛建的目錄結(jié)構(gòu)如下圖
創(chuàng)建完成后，我命令打開圖形化界面vue ui
安裝了這兩個。安裝完成后src的目錄結(jié)構(gòu)有所變化，如圖
接下來我們配置一下環(huán)境吧，
package.json里的scripts配置serve stage build，通過--mode xxx來執(zhí)行不同環(huán)境
通過npm run serve啟動本地 , 執(zhí)行development
通過npm run stage打包測試 , 執(zhí)行staging
通過npm run build打包正式 , 執(zhí)行production
當(dāng)運行?vue-cli-service?命令時，所有的環(huán)境變量都從對應(yīng)的環(huán)境文件中載入。如果文件內(nèi)部不包含?NODE_ENV?變量，它的值將取決于模式，例如，在?production?模式下被設(shè)置為?"production"，在?test?模式下被設(shè)置為?"test"，默認(rèn)則是?"development"。
NODE_ENV?將決定您的應(yīng)用運行的模式，是開發(fā)，生產(chǎn)還是測試，因此也決定了創(chuàng)建哪種 webpack 配置。
在項目根目錄中放置下列文件來指定環(huán)境變量：
以?VUE_APP_?開頭的變量，在代碼中可以通過?process.env.VUE_APP_?訪問。
比如,VUE_APP_ENV = 'development'?通過process.env.VUE_APP_ENV?訪問。
除了?VUE_APP_*?變量之外，在你的應(yīng)用代碼中始終可用的還有兩個特殊的變量NODE_ENV?和BASE_URL
然后在config 下新建三個對應(yīng)的文件，里面配置更多的變量
在這里我只放一下開發(fā)環(huán)境的代碼吧，別的環(huán)境雷同
config/index.js
// 根據(jù)環(huán)境引入不同配置?
const config=require('./env.'+process.env.VUE_APP_ENV)?
module.exports=config
接下來做移動端適配（字體適配固定px轉(zhuǎn)rem）
postcss-pxtorem?是一款 postcss 插件，用于將單位轉(zhuǎn)化為 rem
lib-flexible?用于設(shè)置 rem 基準(zhǔn)值
npm install lib-flexible --save-dev
npm install lib-flexible --save
在根目錄下創(chuàng)建?.postcssrc.js文件，并配置如下：
在main.js中引入
// 在index.html中修改meta
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
接下來我們引入vant ui吧
我是用vue ui安裝的vant
項目采 用Vant 自動按需引入組件 (推薦)下 面安裝插件介紹：
babel-plugin-import?是一款?babel?插件，它會在編譯過程中將?import?的寫法自動轉(zhuǎn)換為按需引入的方式
# 安裝插件npm i babel-plugin-import -D
在babel.config.js?設(shè)置
在?src/plugins/vant.js?下統(tǒng)一管理組件，用哪個引入哪個，無需在頁面里重復(fù)引用。
接下來我們安裝sass:
npm install --save-dev sass-loader
npm install --save-dev?node-sass
