「万字解析」架构视角图文并茂讲述Webpack Loader原理，从基础配置过渡源码实现，最终手把手带你复刻企业级loader。从原理搞懂Webapck中loader是如何处理你的文件。

loader 让 webpack 能够去处理其他类型的文件，并将它们转换为有效 模块，以供应用程序使用，以及被添加到依赖图中。loader 本质上是导出为函数的 JavaScript 模块。

说明一点看webpack的编译流程非常枯燥，即使看完理解之后也不见得能对本上有很多帮助。 Entry: 指定webpack开始构建的入口模块，从该模块开始构建并计算出直接或间接依赖的模块或者库。 Module: 模块，在 Webpack 里一切皆模块，一个模块对应着一个文件。W…

所有人都知道 Webpack 很复杂，但 Webpack 的源码却很优雅，是一个典型的可插拔架构，不仅逻辑清晰，而且灵活好扩展。近几年出来的一些构建工具，大多也都参考了 Webpack 的这种架构方式

在上篇文章《Webpack源码解读：理清编译主流程》中，大体了解了webpack的编译主流程，其中我们跳过了一个重要内容Tapable。webpack 插件向第三方开发者提供了钩入webpack引擎中的编译流程的方式，而Tapable是插件的最核心基础。 本文首先分析Tapab…

webpack的熟练使用已成为当代前端工程师必备的生存技能。毋庸置疑，webpack已成为前端构建工具的佼佼者，网络上关于如何使用webpack的技术文档层出不穷。但鲜有能将webpack的构建流程讲清楚的。本文尝试从解读源码以及断点调试的方式，来探究 webpack 是如何一…

将你的配置信息写到多个分散的文件中去，然后在执行webpack的时候利用--config参数指定要加载的配置文件，配置文件利用moduleimports导出。你可以在webpack/react-starter 看到是使用这种发方法的。 调用第三方的webpack工具，使用其集成…

小程序开发者工具不好用，官方对 npm 的支持有限，缺少对 webpack, babel 等前端常用工具链的支持。 多端框架(Mpvue, Taro)崛起，但限制了原生小程序的能力。 我司在使用一段时间多端开发框架后，决定回退到原生方案，除了多端框架对原生能力有所限制外，最重要…

Webpack可以将其理解是一种基于事件流的编程范例，一个插件合集。 而将这些插件控制在webapck事件流上的运行的就是webpack自己写的基础类Tapable。 将plugin控制在webapack事件流上运行（如下图）。后面我们将看到核心的对象 Compiler、Com…