组件库的封装，是一个前端开发的日常工作之一，本文介绍了从零开始，用Webpack打包一个组件库的过程。

初衷： 整理一些常用的loader分享给大家，方便知道在什么场景下该用什么loader。如果有大佬都懂悄悄左滑就行，不喜勿喷。 适合人群： 前端初级开发。 用途： 用于将css编译完成的样式，挂载到页面style标签上。需要注意loader执行顺序，style-loader放到…

创建 webpack-demo-main 文件夹。 在该文件中，我们新增 private: true 参数，该参数是确保私有。移除掉 main 参数。 output 指示 webpack 如何去输出、以及在哪里输出你的「bundle、asset 和其他你所打包或使用 webpa…

Hi~ o(*￣▽￣*)ブ这是 Webpack5 搭建 React nice的开发环境的最后一篇。由于上一篇主要拿来试水讲的可能比较浅，细节考虑的不是很到位，那么通过这篇来完善一下吧。干货还是可以的看完会有收获，建议边看边喝水。最近也是忙着搞埋点，我也不想咕咕咕（放各位鸽子），…

...

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

最近打算写一款webpack压缩图片的插件，但是需要数据对比，原始数据和压缩后的数据以及压缩的比例相关信息，于是想到了webpack打包的时候不就有相关的输出嘛，于是查看了一下webpack是怎么输出信息的。 首先在webpack官网看到所有输出的相关信息全部有stats来管理…

dvetool: "inline-source-map"。 一个简单的实例，后面会逐行进行解读，a是入口文件，依赖b和c模块。 1.声明一个module缓存变量，对已加载的模块不会重复执行。 2. 声明一个加载模块的方法 __webpack_require__。核心方法，整个执…

Webpack 迭代到4.x版本后，其源码已经十分庞大，对各种开发场景进行了高度抽象，阅读成本也愈发昂贵。但是为了了解其内部的工作原理，让我们尝试从一个最简单的 webpack 配置入手，从工具设计者的角度开发一款低配版的 Webpack。 假设某一天，我们接到了需求，需要开发…