Angular 如何在构建时用AOT替换角度模块？

我需要能够用一个非常简单的模块替换Angular应用程序中的一个相当大的模块，以使我的服务器端渲染构建加载（避免对过于丰富而无法在服务器上工作的组件的所有不必要的要求）。如果没有替换，代码将尝试加载

窗口

或

文档

。我可以简单地用

null加载程序替换一些库，但是在这个例子中，我需要通过修剪这个特定的模块来切断整个依赖关系树

尽管我试图覆盖原来的模块，Angular（
@ngtools/webpack
）还是成功地为我希望修剪的组件生成了
require
调用

我试过：


使用编译器插件的
hostReplacementPaths
参数


使用
NormalModuleReplacementPlugin


文件替换加载程序

我怀疑angular编译器正在扫描文件以查找网页包之外的依赖项

有没有办法在构建时用模拟模块覆盖单个角度模块？
我找到了一个解决方案。我必须为module.ts创建一个中间模块
src/js/app/mock中间版本，以重新导出需要修剪的模块

import { NgModule } from '@angular/core';
import { ModuleThatYouNeedToReplaceAtBuildTime } from '../app/module-to-replace-at-build-time';

@NgModule({
  exports: [
    ModuleThatYouNeedToReplaceAtBuildTime,
  ],
})
export class IntermediateVersionOfTheModule {
}

并创建一个模拟版本的
中间版本的模块
：

src/js/app/mock模块的中间版本。ts

import { NgModule } from '@angular/core';

@NgModule({
})
export class LandingHelpModule {
}

然后在
AngularCompilerPlugin
配置中传递以下命令：

new AotPlugin({
  tsConfigPath: 'tsconfig.ssr.json',
  entryModule: path.join(__dirname, 'src/js/landing/landing.server.module.ts#LandingServerModule'),
  hostReplacementPaths: {
    [path.resolve('intermediate-version-of-the-module.ts')]: path.resolve('./mock-intermediate-version-of-the-module.ts')
  }
})

诀窍是替换一个只是中间模块的模块，它重新导出我们想要修剪的实际模块。angular编译器扫描整个模块树，无法处理任何没有模块的组件和具有相同组件的重复模块

希望对大家有用
 我也有同样的问题。我们经常使用文件覆盖，我编写了一个用于文件替换的网页包解析器插件。切换到AOT后，插件不再工作。覆盖仅在第一次生成时反映一次。但不知何故，@ngtools/webpack仍然引用未重写的文件，因此监视程序不会检测并重新编译重写文件中的更改

我还尝试了hostReplacementPath，但在我的例子中，这不是一个解决方案，因为hostReplacementPath Replacement似乎不是“可传递的”。因此，在新上下文中找不到通过hostReplacment插入的文件中的相对导入

我现在的解决方案是使用JIT进行开发，并在生产中切换到AOT，尽管这有点容易出错。ngtools/webpack的文档多少表明JIT中的解决方法有些不同

skipCodeGeneration。可选，默认为false。禁用代码生成，不要将代码重构为引导。这将templateUrl：“string”替换为template:require（“string”）（样式与之类似），以允许网页正确链接资源。（）

启用skipCodeGeneration需要使用platformBrowserDynamic来引导应用程序，并对网页包配置（非ngfactory样式）进行一些小的修改

我想这是AOT编译中的一些奇怪的机制，将来会得到修复，但我对此没有任何希望

import { NgModule } from '@angular/core';
import { ModuleThatYouNeedToReplaceAtBuildTime } from '../app/module-to-replace-at-build-time';

@NgModule({
  exports: [
    ModuleThatYouNeedToReplaceAtBuildTime,
  ],
})
export class IntermediateVersionOfTheModule {
}

import { NgModule } from '@angular/core';

@NgModule({
})
export class LandingHelpModule {
}

new AotPlugin({
  tsConfigPath: 'tsconfig.ssr.json',
  entryModule: path.join(__dirname, 'src/js/landing/landing.server.module.ts#LandingServerModule'),
  hostReplacementPaths: {
    [path.resolve('intermediate-version-of-the-module.ts')]: path.resolve('./mock-intermediate-version-of-the-module.ts')
  }
})