【vuejs cli3最佳實踐系列】vuejs cli3 env配置文件實踐指南

項目背景

項目地址 https://github.com/wsdo/vuejs...
文章首發： https://shudong.wang/10352.html

env文件

配置四個環境名字分別

VUE_APP_ENV=dev

只支持：VUE_APP_ 開頭，好比設置其它變量 VUE_APP_NAME=stark

package.json 配置 方式

"scripts": {
    "start": "npm run dev",
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "dev": "vue-cli-service serve --mode dev",
    "test": "vue-cli-service build --mode test",
    "pre": "vue-cli-service build --mode pre",
    "prod": "vue-cli-service build --mode prod",
    "lint": "vue-cli-service lint"
  },

項目中使用方式

啓動方式

npm start // 默認dev
npm run test // test 環境
...
以此類推

項目中讀取方式

經過 process.env 獲取設置的變量
好比：console.log('當前的環境是',process.env.VUE_APP_ENV)

應用場景

• 能夠在項目中設置，配置的，api host base url ，api 基礎接口
• 須要根據環境變量設置的參數