webpack中静态文件生成的原理，细节还是非常多的，通过本文对详细过程分析以及一些demo实践，逐步揭开静态文件生成的面纱，希望可以帮助到你

webpack 使用 enhanced-resolve 进行路径解析。它的作用类似于一个异步的 require.resolve 方法，将 require / import 语句中引入的字符串，解析为引入文件的绝对路径。 在其官方文档中，将其描述为高度可配置，这得益于它完善的插件…

经过前几篇文章我们介绍了 webpack 如何从配置文件的入口开始，将每一个文件转变为内部的 module，然后再由 module 整合成一个一个的 chunk。这篇文章我们来看一下最后一步 —— chunk 如何转变为最终的 js 文件。 上篇文章主要是梳理了在 seal 阶…

webpack 对于不同依赖模块的模板处理都有单独的依赖模块类型文件来进行处理。例如，在你写的源代码当中，使用的是ES Module，那么最终会由 HarmonyModulesPlugin 里面使用的依赖进行处理，再例如你写的源码中模块使用的是符合 CommonJS Modul…

这篇文章主要是通过源码去探索下 webpack 是如何通过在编译环节创建的 module graph 来生成对应的 chunk graph。 我们都知道 webpack 打包构建时会根据你的具体业务代码和 webpack 相关配置来决定输出的最终文件，具体的文件的名和文件数量也…

webpack作为目前主流的前端构建工具，我们几乎每天都需要与它打交道。是一个足够开放的类库，提供了可插拔的方式去自定义一些配置，包括配置 loader和plugin，本篇我们主要讨论loader

上一节，学习到通过webpack-dev-server搭配HotModuleReplacementPlugin插件可以实现不刷新页面的模块热更新。 就是webpack-dev-middleware。 可以看到重新编译了，这时候我们手动刷新下页面，即可看到修改。 以上就是webp…

因为 devops 的项目结构一开始并不是前后端分离的，所以要进行去 local-dev-server 实现前后端分离配置，当然根据前辈清晰的教程自己也成功实现，但是期间对整个webpack启动本地服务过程。以及webpack-dev-server的原理也一知半解，索性就去了解…

上一节我学习了webpack-dev-middleware，但是单独使用它并没有实现热更新，所以这节我要学习搭配使用webpack-hot-middleware，来实现热更新功能。 HMR- Hot Module Replacement即热更新，这已经很明白地告诉我们热更新已经…