上一篇博客介紹了vue-cli2.x配置build命令構建測試包和正式包，但現在前端開發vue項目大多數使用新版@vue/cli腳手架搭建vue項目(vue create project-name)
通過@vue/cli構建的項目無build和config配置文件夾，采用vue.config.js替代
項目中常分為開發環境、測試環境、正式環境，通常不同環境使用的服務端請求地址或一些資源文件是不同的，區分開發環境和(測試正式環境)可使用process.env.NODE_ENV來判斷('development'/'production')但是通過npm run build構建的環境(測試環境和正式環境)的process.env.NODE_ENV都是production，要做區分判斷通常在每次打包都手動去修改一些配置文件或通過判斷域名等信息來區分，這是很不方便的，我們可以通過配置build命令來解決這個問題
在根目錄下新建.env.build(正式)和.env.test(測試)兩個文件，兩個文件都聲明變量NODE_ENV = 'production'，此時使用另一個變量VUE_APP_CURRENTMODE來區分測試、正式環境
outputDir為打包文件存放的文件夾
此時代碼中可通過process.env.NODE_ENV和process.env.VUE_APP_CURRENTMODE兩個變量來區分這三個環境做對應的變化
然后配置package.json中script腳本命令
npm run serve / npm run dev運行本地開發環境對應process.env.NODE_ENV = 'development'
npm run build:prod構建正式環境包，文件存放在dist文件夾內
npm run build:test構建測試環境包，文件存放在test文件夾內
npm run publish同時構建測試環境和正式環境包
修改vue.config.js中outputDir: process.env.outputDir
然后運行相關命令就可以了，這樣就不需要每次打包去修改配置或通過代碼判斷域名等信息了
注：
每次build時都會自動清除上一次的打包的整個文件夾(dist/test)然后在打包完成時重新構建這兩個文件夾，通過加--no-clean參數可取消該默認行為
注：
若在打包過程中出現該警告，表示打包文件過大
可修改vue.config.js
configureWebpack: config => {
...
return {
performance: {
"maxEntrypointSize": 10000000,
"maxAssetSize": 30000000
}
};
}