柒青衿的博客

最近有同学致力于写一个脚手架工具，在研究webpack源码，问了我几个问题，然而我完全不能解答。于是开始研究webpack。webpack做的事情主要是实现前端模块化（即：让前端也可以像node端一样适用require方法加载模块）和借助插件实现编译、热加载等功能。webpack源码系列第一部分，就分享最简单的内容——如何使用require方法加载模块并打包。__webpack_require__

在上一篇博客中分析了webpack打包以后的bundle文件，了解webpack是如何通过require模拟commonjs标准加载模块的。下面探索webpack整体调用的流程，也就是如何通过shell输入webpack命令就可以实现整个编译、打包过程的。 这篇博客只对整个流程及相关的事件流进行分析，不具体分析每个步骤中的具体实现。也就是，对于plugin和loader的具体分析请移步后面的博客

这篇博客告诉你如何入手写一个plugin，然后分析源码相关部分告诉你你的plugin是如何工作。知其然且知其所以然。

从黑盒和白盒两个角度讲讲如何写一个loader以及loader这个东西是如何在webpack中运作起来的。loader相当于一个翻译器，具体的loader会有很大不同，比如less-loader和ejs-loader内部代码肯定差异极大，这里只以最简单的loader举例，入坑以后大家根据自己需求自行探索。