如果 process.env.VUE_APP_* 环境变量之一无法解析，如何使 vue-cli-service 失败答案

【问题标题】：How to make vue-cli-service fail if one of the process.env.VUE_APP_* environment vars cannot be resolved如果 process.env.VUE_APP_* 环境变量之一无法解析，如何使 vue-cli-service 失败
【发布时间】：2020-09-22 21:25:58
【问题描述】：

我在我的代码中使用了环境变量，如vue-cli-service environment variables section 中所述，并且在定义环境变量时它肯定可以工作。

但是当其中一个环境变量未定义时，它只是将其替换为未定义。

假设我引入了一个新的process.env.VUE_APP_MY_NEW_VAR，但是我没有在环境中设置它，它只会在那里放置一个undefined。

我想确保在构建项目 (npx vue-cli-service build [...]) 时，没有任何环境变量未定义。

我的一个想法是始终检查undefined，但它会发生在运行时，而不是编译时。

另一个想法是创建一个 shell 脚本来检查所有变量是否在构建之前设置，但这听起来很手动。

有没有办法对其进行配置并使其成为构建的一部分？

【问题讨论】：

标签： javascript vue.js webpack environment-variables vue-cli-3

【解决方案1】：

您可以在vue.config.js 中添加支票。例如

const REQUIRED_ENV_VARS = [
  'VUE_APP_VAR_1',
  'VUE_APP_VAR_2'
]

if (REQUIRED_ENV_VARS.some(env => typeof process.env[env] === 'undefined')) {
  throw new Error('Required environment variables are missing')
}

【讨论】：