面试官：“你自己开发过 Vite 的插件吗？”，给我20分钟，保姆级教程带你手摸手，又快又稳的get它的原理。

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

经常逛 webpack 官网的同学应该会很眼熟上面的图。正如它宣传的一样，webpack 能把左侧各种类型的文件（webpack 把它们叫作「模块」）统一打包为右边被通用浏览器支持的文件。webpack 就像是魔术师的帽子，放进去一条丝巾，变出来一只白鸽。那这个「魔术」的过程是…

1. loader 十问 在我学习webpack loader的过程中，也阅读了网上很多相关文章，收获不少。但是大多都只介绍了loader的配置方式或者loader的编写方式，对其中参数、api及其他细节的介绍并不清晰。 也许你也会有类似的疑问。下面我会结合loader相关的部…

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

旧代码，导致自己没法完全找到所有的图片相关代码实在坑爹，所以想办法一次性解决。 一开始想到的办法就是项目打包完毕后将图片文件夹内的图片全部上传，配置url-loader将图片路径全部替换成网络路径，途中遇到很多坑，待我一一道来。 我这里使用的是（afterEmit）：生成资源到…

Webpack通过Loader完成模块的转换工作，让“一切皆模块”成为可能。Plugin机制则让其更加灵活，可以在Webpack生命周期中调用钩子完成各种任务，包括修改输出资源、输出目录等等。 今天我们一起来学习如何编写Webpack插件[1]。 在编写插件之前，还需要了解一下…

做自己的轮子，让别人用去吧。 本文灵感源自业务中的经验总结，不怕神一样的产品，只怕一根筋的开发。 在项目打包遇到问题：“当项目托管到 CDN 平台，希望实现项目中的 index.js 不被缓存”。因为我们需要修改 index.js 中的内容，不想用户被缓存。 打包时动态创建 s…

这是一篇干货比较多的组件库搭建实战教程，不仅有通用的代码规范、提交规范、文档维护、单元测试、GitHub Action 配置的讲解，还涉及基于 lerna 的多包管理架构...