Question

我正在使用angular4（4.4.6）和CLI 1.4.3。我尝试制作环境变量，如本文所示： https://alligator.io/angular/environment-variables/

我最终得到3个文件：的 environment.ts

export const environment = {
  production: false,
  restUrl: 'http://localhost:3000/',
  socketUrl: 'http://localhost:2000'
};

environment.prod.ts

export const environment = {
  production: true,
  restUrl: 'http://139.130.4.5:3000/',
  socketUrl: 'http://139.130.4.5:2000'
};

和 environment.staging.ts

export const environment = {
  production: true,
  restUrl: 'http://139.130.4.5:3000/',
  socketUrl: 'http://139.130.4.5:2000'
};

我按如下方式使用它们：

import { environment } from '../../environments/environment';
 constructor() {
    this.serverUrl = environment.restUrl;
    console.log('the env is:' this.serverUrl');
  }

并在 .angular-cli.json 中我有以下内容：

"environmentSource": "environments/environment.ts",
      "environments": {
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts",
        "staging": "environments/environment.staging.ts"
      }

由于某种原因，当我运行ng build --env=prod时，它会编译所有内容，但最终产品使用localHost（dev）环境变量。

更奇怪的是，当我使用ng server --env=prod时，它与生产变量完美配合。

为什么会这样？如何使用prod或staging环境变量构建？

Answer 1

使用这样的命令来构建Anuglar 6

ng build --prod --configuration=dev

或使用别名：

ng build --prod --c=dev

Answer 2

尝试设置目标环境：

ng build --target=production --environment=prod
或
ng build --prod --env=prod
或
ng build --prod

默认使用每个https://github.com/angular/angular-cli/wiki/build开发目标。

Answer 3

这是一个在较新版本的cli中修复的旧问题。如果不知道你正在使用什么cli和@angular minor和patch版本，我无法判断它是不是。

尝试将./添加到。angular-cli.json envs。

"environments": {
    "dev": "./environments/environment.ts",
    "prod": "./environments/environment.prod.ts",
    "staging": "./environments/environment.staging.ts"
}

如果这样可以解决这个问题，那么我建议您将依赖项和cli升级到最新版本，并将角度包升级到最新的4.minor.patch版本，以防止遇到其他已修复的错误。

Answer 4

Angular 7-通过CLI创建的项目：

ng build --prod --configuration production

Answer 5

确保各个组件中的导入均正确。错误导入错误的环境文件也可能导致此问题。就我而言，我的导入是这样的：

import { environment } from '../../../../environment/environment.dev';

这使我们很多人感到困惑，直到我们从不看进口品的情况下才发现它。我们必须仅导入environment.ts文件，然后才能使用替换后的文件。更正后的导入将如下所示：

import { environment } from 'src/environments/environment';

Answer 6

尝试使用以下命令

ng build -prod

--ng build --env = prod无效

6 个答案: