Question

我希望能够在构建时更改我的angular将从服务器获取资源的url。我想在构建期间传递一个参数来更改url值背后的原因是在不同的docker容器中部署。

environment.docker.ts

export const environment = {
  ...
  url: "localhost:8080"
};

我希望有类似ng build --env docker --url:"localhost:9090"的内容，它会在构建时更新默认值。

Answer 1

这已经由CLI处理了。

假设您有多种环境：

environment.ts
environment.local.ts
environment.docker.ts
environment.prod.ts

所有文件必须导出相同的变量，具有不同的值。这意味着您可以更改url属性，但无法将其删除。

拥有这些环境后，请打开angular-cli.json文件。在environments属性下，添加您的环境：

"environments": {
  "local": "environments/environment.local.ts",
  "docker": "environments/environment.docker.ts",
  "prod": "environments/environment.prod.ts"
}

现在，您可以使用您选择的环境进行构建：CLI将使用正确的文件。

$ ng build --env docker
$ ng build --env local
$ ng build --env prod

Answer 2

创建环境文件environment.prod.ts：

export const environment = {
  production: true,
  apiUrl: '$BACKEND_URL'
};

运行ng build --prod true。

现在，在运行之前，在所有生成的html文件中替换变量：

cd dist;
find . -type f -exec sed -i 's~\$BACKEND_URL~https://mybackend.domain.com~g' {} \;

然后，您可以在运行之前运行此替换命令，例如，在运行时运行docker容器之前。

PS：仅在此命令替换了变量“ in place”后才能运行该命令，并在需要时制作dist的备份副本。

在运行时更改角度env变量

2 个答案: