NodeEnvironmentPlugin由四个基本的文件系统组成，分别是inputFileSystem与outputFileSystem处理文件i/o，watchFileSystem监听文件改动，intermediateFileSystem则处理所有不被看做是输入或输出文件系…

Webpack 一直都是有些人的心魔，不清楚原理是什么，不知道怎么去配置，只会基本的 API 使用。它就像一个黑盒，让部分开发者对它望而生畏。 而本节最大的作用，就是帮大家一点一点的消灭心魔。

👋 事情是这样的，作为一名母胎 solo 二十几年的我，平平无奇的一直活在别人的狗粮之下。渐渐的，我好像活成了一个随时见证别人爱情，也随时能为失恋的人排忧解难的角色。 直到前两天，公司新来了一个前端

前一段时间我把webpack源码大概读了一遍，webpack 到4.x版本后，其源码已经比较庞大，对各种开发场景进行了高度抽象，阅读成本也愈发昂贵。 过度分析源码对于大家并没有太大的帮助。本文主要是想通过分析webpack的构建流程以及实现一个简单的webpack来让大家对we…

plugin作为webpack的中流砥柱，一直是大厂面试官热衷于拿来考察面试者的一个问题，5.x版本很多语法发生了改变，本文从0到1带你掌握一个webpack5.x版本的plugin开发该有的姿势

通常，js代码出错，控制台会提示第几行第几列代码出错。但是webpack打包压缩后的代码，都被压缩到了一行，变量也变成了a,b,c,d。代码出错，控制台就没法正确的提示错误位置。 sourceMap就可以解决这个问题。sourceMap就是一个信息文件，里面储存着打包前的位置信…

Loader本质就是一个函数，在该函数中对接收到的内容进行转换，返回转换后的结果。因为Webpack只认识JavaScript，所以Loader就成了翻译官，对其他类型的资源进行转译预处理工作。 loader在module.rules中配置：test和use。test可接收一个…

何为插件(Plugin)？专注处理 webpack 在编译过程中的某个特定的任务的功能模块，可以称为插件。

本文从这 2 个角度出发，收集一些相关优化资料。 resolve.modules 用于配置 Webpack 去哪些目录下寻找第三方模块，默认是 ['node_modules']。 但是，它会先去当前目录的 ./node_modules 查找，没有的话再去 ../node_mod…