Angular6部署项目到服务器，第一次打开页面慢

Angular6项目打包命令ng build,这种打包的压缩包大小一般都会很大的，我推荐使用ng build --prod --aot,这种打包的方法可以大大压缩压缩包的大小，大概可以压缩60%，但是一般会出现一些语法上的报错，比如一个变量在html中声明，但是没有在ts文件中赋值，那么就会出现报错，说语法错误，这种打包的方法就是非常的严谨，对语法上的要求更细节。

这样打包之后的文件部署到服务器上之后打开项目就会快乐不少，之前需要10s，现在需要5s左右，但是感觉还是很慢，所以我又想出了一个方法，路由懒加载，这是通过把路由的每一个部分分开在自己的路由模块加载，不会统一在app-routing里面一起加载，这样就大大减少了加载依赖文件main.js的大小，具体做法如下：

1、ng generate module customer --routing 

customer是我们项目中的一个组建的名字这样我们就给customer穿件了一个路由模块和依赖模块，如下图：

2、之后我们需要在app-routing.ts文件中把之前的路由加载格式改成懒加载，具体代码如下

 {
        path:'homepage',
        loadChildren:'./components/homepage/homepage.module#HomepageModule',
      },
      {
        path:'access-management',
        loadChildren:'./components/access-management/access-management.module#AccessManagementModule',
      },
      {
        path:'access-management/add-user',
        loadChildren:'./components/access-management/add-user/add-user.module#AddUserModule'
      },

3、然后在customer.module.ts文件中把这个组件需要引入的模块引入到ts文件中，如下图：

4、并且在customer-routing.ts文件中把路由引入，如下图：

5、最后用打包的命令ng build --prod --aot，打包之后就会把每一个的路由文件单独加载，并且生成单独的文件，如下图：

这样把项目部署到服务器最后，每一个组建的路由就会单独加载，这样就会加快第一次加载页面的速度，做完这些之后页面打开只需要2s多一点，基本上符合大众的要求。