Angular + Azure DevOps(TFS)：替换 environment.ts 文件中的令牌，与环境无关的 Angular 构建答案

【问题标题】：Angular + Azure DevOps(TFS): replace tokens in environment.ts file, environment agnostic angular buildAngular + Azure DevOps(TFS)：替换 environment.ts 文件中的令牌，与环境无关的 Angular 构建
【发布时间】：2019-04-04 21:03:41
【问题描述】：

假设我们有一个标记化的environment.ts 文件，例如：

export const environment = {
  production: #{production}#
}

其中production 类型必须为boolean。

现在，我们想要ng build，以便我们获得一个与环境无关的构建，我们可以将其部署到任何环境。在部署到特定环境时，我们只需替换 main.js 或 main.*.js 中的令牌（这是捆绑 environment.ts 文件的位置）。

问题是，ng build 失败，因为上面的 environment.ts 有编译时间错误。

有什么方法可以实现吗？如何生成一个与环境无关的 Angular 应用程序构建，它可以部署到具有任何配置的任何环境？

PS：这个task是用来替换令牌的

【问题讨论】：

我对替换捆绑文件中的令牌不满意，但我真的没有找到任何其他解决方案。有人可能会建议将配置移至 ConfigService 等，但那是另一回事。

标签： angular tfs deployment build azure-devops

【解决方案1】：

这是我迄今为止提出的：

export const environment = {
   production: !!'#{production}#',
}

当 VSTS 变量 production 不为空时，!!'#{production}#' 解析为 true，否则解析为 false。

因为 VSTS 确实会忽略具有空字符串 ("") 值的变量。将 production 变量的 falsy 值设置为：

根据任务设置：

【讨论】：

【解决方案2】：

在使用替换令牌任务时使文件仍然编译的最简单解决方案是：

export const environment = {
  production: '#{production}#' === 'true'
}

在您的管道中，将变量 production 设置为值 false，而不是在生产中（或任何值以避免任务警告您未定义的变量）和 true 在生产时。

【讨论】：