angular5+模块懒加载

为什么要使用懒加载？

当用户访问 /xxx/**页面路径的时候，才会加载对应的模块，这减少了应用启动时加载资源的大小,页面打开速度快。

1.创建项目

  //创建项目custer-app，并配置路由    

 ng new custer-app --routing

2.进入该项目里

  cd custer-app

3.初始化项目

 npm install

4.运行项目

ng serve

5.创建模块并且配置该模块路由

 // 在module文件夹下分别创建user,product,article模块（可在指定文件夹下创建模块） 

    ng g module module/user --routing

    ng g module module/product --routing

    ng g module module/article --routing

文件目录如下：

6.分别为user,product,article创建对应的组件

 ng g component module/user

  ng g component module/product

  ng g component module/article

组件创建后文件目录如下：

7.分别为user,product,article配置对应的路由

   // user,product,article路由配置步骤如下，这里就不一一演示

8.在根由里配置子模块路由路径

9.如何在模块里添加子路由(看图片里的说明)