angular懒加载的问题

一、懒加载实现(AppRoutingModule)

(1)实现代码:

angular懒加载的问题

 

 

 但是在项目运行时,就一直报错:

angular懒加载的问题

 

 

 

(2)解决方法:

后来一直百度,发现了一篇明灯博客,稍后奉上。

然后检查了我自己的代码,因为我引入了公共的share.module.ts(内部为需要的ant-design的一些引入)到app.module.ts中,share.module.ts中引入了BrowserAnimationsModule,app.module.ts中也引入了BrowserAnimationsModule......

注:share.module.ts中的引入应为exports

angular懒加载的问题     angular懒加载的问题

(3)出错原因

BrowserModule只能import一次,并且如果引入了 BrowserAnimationsModule 或者 NoopAnimationsModule 就不需要再引入 BrowserModule 了,前两个已经内部引用了。

(4)常见模块作用

官方文档指出(Angular - API 列表

模块名 作用
BrowserModule 用于启动和运行浏览器应用的的基本服务,导出所有 Angular 应用都需要的基础设施。默认包含在用 CLI 的 new 命令创建的所有 Angular 应用中。 
CommonModule 导出所有基本的 Angular 指令和管道,例如 NgIfNgForOfDecimalPipe 等
FormsModule 使用 NgModel 构建模板驱动表单。
ReactiveFormsModule 含有响应式表单所需的基础设施和指令
RouterModule 使用前端路由
BrowserAnimationsModule  动画模块

(5)参考博客

  1.Angular LazyLoad Module 常见问题 - PasteBin of GC (guchengf.me)

上一篇:Angular Universal:Angular 统一平台简介


下一篇:Vue系列—初识Vue