Web Front End

Angular LazyLoad Module 常见问题

1. BrowserModule has already been loaded. If you need access to common directives such as NgIf and NgFor from a lazy loaded module, import CommonModule instead.

BrowserModule 在整个 Angular 应用中只需要引入一次,通常在 app.module.ts 中引入一次就好了,并且如果引入了 BrowserAnimationsModule 或者 NoopAnimationsModule 就不需要再引入 BrowserModule 了,前两个已经内部引用了。

其他模块或者说公共模块中只需要引入 CommonModule 就可以了。

2. TS1323: Dynamic import is only supported when '--module' flag is 'commonjs' or 'esNext'

因为目前 Dynamic import 特性还是 esNext 的阶段,而 Angular Cli 的 tsconfig 默认是 es2015,所以使用 import() 会提示这个错误。

将你项目下的 tsconfig.json 中的 module 改为 esnext

这个问题发生在升级到 Angular 8.0 之后,因为这一版本更改了 loadChildren 的使用方式,新版使用了 import(),但是没有正确更新 tsconfig,就会导致这个问题。