模块化一小步，编译的一大步

前言：当 webpack 编译性能优化作到极限的时候，咱们应该跳出webpack编译优化的陷阱。由于编译原本就存在瓶颈。

（拿我司vue项目来讲）：
            当项目中的vue文件，从1到1000的时候，甚至还在一每天增多，如何维护好他们确实是一门学问，由于随之而来的编译速度，时时刻刻不在浪费咱们团队中每一个人的生命。

            项目启动 和 hotReload 编译 速度：

                 项目启动速度须要 ：50秒 左右 

                 hotReload 编译速度须要： 15秒 左右 

 

你还敢相信webpack能帮你解决编译性能的问题吗？致命的问题是它没办法帮你解决掉文件的数量，因此webpack编译自己已经成为了瓶颈。

 

因此我想到了一个解决方案：模块化 （这里模块化概念是指：按照后台菜单模块来拆分，把（页面vue文件 和 路由router.js）维护在一块儿）

           其实模块化，能够按照其它（业务、功能）等维度来划分。

         

             

选择模块化理由： 一个大项目原本就是由多我的同时开发维护，开发人员各自只需关心本身模块下写的页面代码。(举个栗子：把 a - w 字母看成模块化的概念，若是我此次开发涉及到 a、b 2个模块，其实  c-w 模块压根是你不须要关心的模块），咱们其实能够按需编译。 我猜测了一下若是按照模块化的思路，若是只针对本次修改的模块进行编译，是否是编译的瓶颈就解决了，顺着这个思路，我实践了模块化的按需编译，实践证实是没问题的

 

模块化方案，如图所示：

 

别看模块化一小步，编译性能一大步 ：

最终，项目启动速度由：50秒  ->  9秒

 最终，hotReload编译速度由：15秒  -> 1秒