我有两个环境-一个用于测试,另一个用于发布.我有一个独立的组件可以帮助我进行调试,但我不想将其包含在发布版本中.我如何才能排除它?我的意思是,我的目标不是隐藏它(在任何 *ngIf标志后面),而是将其从构建中完全删除.

推荐答案

Two possible ways:

  1. Deferrable Views

您可以使用Angular(https://angular.io/guide/defer)的延迟视图功能.

您将能够定义类似于以下内容:

@defer (when debugMode) {
  <your-component />
}

其中debugMode是环境变量.

这基本上是组件的懒惰加载功能.

  1. TsConfig File Exclude

您实际上可以从Angular构建中排除文件tsconfig.json:

"exclude": [
    "path/to/your/file.ts"
]

要使用此功能,您可能需要为"生产"构建设置一个tsconfig.json,为不排除该文件的"调试"构建设置一个tsconfig.json.

然后更新angular.json以使用正确的tsconnect文件来构建:

"fileReplacements": [
  {
    "replace": "src/environments/environment.ts",
    "with": "src/environments/environment.prod.ts"
  },
  {
    "replace": "src/yourconfig.ts",
    "with": "src/yourconfig.prod.ts"
  }
],

Angular相关问答推荐

从Angular 14更新到15个多边形.ts问题

当元素在元素上使用迭代变量时,如何重构ngFor?

Angular 如何观察DOM元素属性的变化?

天使17中的倒计时器

对Angular 为17的路径使用AuthGuard

当快速拖动光标时会丢失元素 - Angular

如何在 Angular 中每 x 秒从 REST api 加载数据并更新 UI 而不会闪烁?

Angular 迁移 14 到 15 / 16:angular universal 是否停止将 <!-- this page was prerendered with angular universal --> 用于预渲染页面?

从具有特定 node 值的现有数组创建新数组

等待两个订阅完成而不嵌套

显示 1 个数据而不是所有 ngFor - Angular 11

ng test 和 ng e2e 之间的真正区别是什么

取消订阅服务中的http observable

Angular Material 模态对话框周围的空白

`[(ngModel)]` vs `[(value)]`

Angular 2 应用程序中没有Access-Control-Allow-Origin标头

Angular 2 router.navigate

Lint 错误:实现生命周期挂钩接口

Angular 4 material表突出显示一行

如何使用formControlName和处理嵌套的formGroup?