angular - 在 Angular2 中将某些组件排除在生产构建之外？

Question

在 Angular2/4 的生产构建中，有没有什么方法可以在构建时省略我选择的代码组件/部分？

我有一个应用程序，其中包含我在本地使用的管理工具。我希望这个管理工具不在应用程序的生产版本中。我当然可以在每次进行生产构建时对代码进行注释，但是有没有更优雅的解决方案？喜欢在代码的某些部分进行条件构建？

我正在寻找类似 *ngIf="buildingForProduction"的解决方案类型的任何东西在这个方向上。存在吗？

Answer 1

基于@cyrix 的回答。

当使用 ang cli 时，有一个名为 environment 的文件夹，默认包含文件 environment.prod.ts 和 environment.ts。如果需要，您可以为不同的构建添加更多内容，并相应地配置您的应用。

这些文件包含这样一个对象:

export const environment = {
  production: false,
  myVariable: 'This variable is not included in production build'
};

当您构建应用时

ng build --env=prod

然后 ang cli 将使用 environment.prod.ts。如果你用

构建

ng build

然后使用默认的environment.ts。

通过向此环境对象添加变量，您可以将其导入到应用程序中并读取变量。像这样你可以检查你是否在生产版本中:

import { Component } from '@angular/core';
import { environment } from './../environments/environment';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  constructor() {
    console.log(environment.production); // Logs false for default environment
  }
  title = 'app works!';
}