Question

我有一个大模块，但是只导出一个组件，当我导入该模块时，Angular会加载整个模块还是仅加载导出的组件，以便我可以控制性能？我不想将组件移动到通用模块，因为它破坏了结构。谁能给我个建议吗？

更新代码示例

说我有3个组件的ModuleA，只导出其中1个：

@NgModule({
  // ...
  exports: [
    ComponentA
  ],
  declarations: [
    ComponentA,
    ComponentB,
    ComponentC
  ]
})
export class ModuleA { }

在ModuleB中，我导入ModuleA，以便可以使用ComponentA：

@NgModule({
  // ...
  imports: [
    ModuleA
  ]
})
export class ModuleB { }

当应用程序加载ModuleB时，它只是加载ComponentA还是加载ModuleA的所有组件？

Answer 1

因此，如果您说的是：

module.ts

export const foo;

export const bar;

export const baz;

然后 component.ts

import { foo } from './module'

我相信，在开发过程中，您将拥有所有可用的成员，当构建生产版本时，Angular AoT建筑物将使其他成员摇摇欲坠。它使用Webpack这样做。

Webpacks树摇动机制在这里说明： https://webpack.js.org/guides/tree-shaking/

这是有角AoT编译器的文档： https://angular.io/guide/aot-compiler

无论如何，请尝试构建一个产品，如果一切正常，就可以了：）

Angular 2+会加载整个模块还是仅加载导出的组件？

1 个答案: