webpack：代码分割与按需加载

代码分割就是我们根据实际业务需求将代码进行分割，然后在合适的时候在将其加载进入文档中。

代码中总有些东西我们希望拆分开来，比如：

• 使用概率较低的模块，希望后期使用的时候异步加载
• 框架代码，希望能利用浏览器缓存下部分不易变动的代码

懒加载

把不同路由对应的组件分割成不同的代码，然后当路由被访问的时候才加载对应组件。

按需加载拆分：require.ensure()

webpack有代码分割功能。

webpack可以帮我们将代码分成不同的逻辑块，在需要的时候加载这些代码。

require.ensure()是一种使用CommonJS的形式来异步加载模块的策略，在代码中通过require.ensure([<fileurl>])引用模块。

require.ensure(依赖，回调函数，[chunkName])

CSS拆分：使用css-loader

开发者，可能希望能将工程中的所有引入的 CSS 拆分为单个文件，这样可以利用缓存，且利用 CSS 和 JavaScript 并行加载，来加速 web 应用。

 

转载于:https://www.cnblogs.com/knuzy/p/9590114.html