时间戳

首页 > 解决方案 > 如何在不添加一些组件或模块的情况下构建 Angular 应用程序？

javascript - 如何在不添加一些组件或模块的情况下构建 Angular 应用程序？

问题描述

我正在使用 Angular 9 构建一个包含许多模块化的模块和组件的应用程序。当我将构建这个应用程序时，我需要排除一个模块或组件进行编译。我说模块或组件是因为我不知道在编译时排除此功能的最佳方法是什么。

例如：

我有两个组件。
comp1.component.ts包含三个按钮：

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-comp',
  templateUrl: './comp1.component.html',
  styleUrls: []
})
export class Comp1Component implements OnInit {

  title = 'Loaded Component 1.';

  constructor() { }

  ngOnInit(): void {
  }

}

comp2.component.ts包含两个按钮：

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-comp',
  templateUrl: './comp2.component.html',
  styleUrls: []
})
export class Comp2Component implements OnInit {

  title = 'Loaded Component 2.';

  constructor() { }

  ngOnInit(): void {
  }

}

两者.html都是一样的：

<p>{{title}}</p>

通过其他方式，我有另一个组件，我想加载这两个组件中的一个，具体取决于我加载的环境。

在环境 A中，我需要负载comp1.component.ts，在环境 B中，我需要负载comp2.component.ts。但是，如果我加载其中一个组件，则另一个组件不应包含在此应用程序的构建中，但我不知道如何解决这个问题......

有什么想法可以解决这个问题吗？

感谢收看。

标签： javascriptangulartypescript

解决方案

environment您可以在构建目标之间更改文件时执行相同的操作

"configurations": {
  "target-with-component2": {
    "fileReplacements": [
      {
        "replace": "path/to/comp1.component.ts",
        "with": "path/to/comp2.component.ts"
      }
    ],

它将按照问题中的要求替换组件

推荐阅读