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

Question

我在我的代码中使用了环境变量，正如 vue-cli-service environment variables section 中所解释的那样，当定义了环境变量时它确实可以工作。

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

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

我想确保在构建项目 (npx vue-cli-service build [...]) 时，none 的环境变量保持未定义状态。

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

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

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

Answer 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')
}