文档：https://cli.vuejs.org/zh/guide/mode-and-env.html#%E6%A8%A1%E5%BC%8F

一、模式

1、一个 Vue CLI 项目有三个模式：

  • development 模式用于 vue-cli-service serve
  • test 模式用于 vue-cli-service test:unit
  • production 模式用于 vue-cli-service build 和 vue-cli-service test:e2e

2、传递 —mode 选项参数为命令行覆写默认的模式。
例如，如果你想要在构建命令中使用开发环境变量：

  1. vue-cli-service build --mode development

二、环境变量

1、项目根目录中放置下列文件来指定环境变量

  1. .env                # 在所有的环境中被载入
  2. .env.local          # 在所有的环境中被载入，但会被 git 忽略
  3. .env.[mode]         # 只在指定的模式中被载入
  4. .env.[mode].local   # 只在指定的模式中被载入，但会被 git 忽略

2、使用process调用
例子：开发环境和生产环境使用不同的baseUrl

  1. //.env.development
  2. # base api
  3. VUE_APP_BASE_API = 'http://127.0.0.1:7001'
  5. //.env.production
  6. # base api
  7. VUE_APP_BASE_API = ''
  9. // http.js中使用
  10. axios.defaults.baseURL = process.env.VUE_APP_BASE_API;