前言
項目搭建過程中，往往會涉及到2個或以上的環境，比如目前官網已有的開發環境（development）和發佈環境（production），但是如果要增加第三個環境，如預發佈環境（此處用release），就需要自行配置。
如果是用HBuilderX創建的uni-app項目，需要轉爲vue-cli模式的（也就是使用npm），下列給出粗略步驟
- 全局安裝vue-cli(3.x以上)，webpack(如果要使用scss，則需4.35以上) npm install -g @vue/cli webpack
- 執行vue create -p dcloudio/uni-preset-vue 項目名稱 ，創建項目
- 將 HBuilderX 工程內的文件（除 dist、unpackage、node_modules 目錄）拷貝至 vue-cli 工程內 src 目錄，package.json需要手動合併
- 在 vue-cli 工程內重新安裝 npm 依賴（如果之前使用了 npm 依賴的話）
正題開始（npm 多環境配置）
- 複製一行運行或發行的配置，修改NODE_ENV=development爲VUE_APP_ENV=release（因爲vue-cli-service修改NODE_ENV無效，需要換成VUE_APP_ENV），release自定義
- 最好把其他的NODE_ENV統一換成VUE_APP_ENV，之後在配置的時候比較方便
- 在配置js裏就可以如下設置了：
if (process.env.env.VUE_APP_ENV === 'development') { // 開發環境
// to do something
} else if (process.env.VUE_APP_ENV === 'release') { // 預發佈環境
// to do something
} else if (process.env.VUE_APP_ENV === 'production') { // 正式環境
// to do something
} else if (process.env.VUE_APP_ENV === 'developmentTest') { // 純屬測試
// to do something
}
- 執行查看效果
npm run dev:h5:dt
