环境部署

项目模式

Vue CLI 项目有三个模式：

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

可以通过 --mode 选项参数来覆写默认模式；例如，想要在构建命令中使用开发环境变量，请在 package.json 脚本中加入：

"dev-build": "vue-cli-service build --mode development"

获取项目环境(模式)

process.env.NODE_ENV ： 会是 “development”、“production” 或 “test”中的一个，具体值取决于应用运行的模式

process.env.BASE_URL ： 和vue.config.js 中的 publicPath 选项相同，是应用会部署到的基础路径

环境变量配置

启动或打包时可通过 --mode 参数来覆盖默认的环境模式，如下：

"scripts": {
  "serve:dev": "vue-cli-service serve --mode dev",
  "serve:dev.prod": "vue-cli-service serve --mode dev.prod",
  "build:dev": "vue-cli-service build --mode dev",
  "build:prod": "vue-cli-service build --mode prod",
  "build:other": "vue-cli-service build --mode other",
  "lint": "vue-cli-service lint"
},

运行 vue-cli-service 命令时，所有的环境变量都从对应的环境文件中载入；如果环境文件内部不包含 NODE_ENV 变量，则 NODE_ENV 的值将取决于 vue-cli-service 所支持的默认模式；环境文件以 .env 开头，如下：

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

例如下图所示：

注：只有环境文件中的 NODE_ENV，BASE_URL 和以 VUE_APP_ 开头的变量会通过 webpack.DefinePlugin 静态地嵌入到客户端侧代码中，这是为了避免意外公开机器上可能具有相同名称的私钥。

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