Rollup 和 Webpack 是目前项目中使用较为广泛的两种打包工具，去年发布的 Vite 中打包所依赖的也是 Rollup；在对界面加载效率要求越来越高的今天，打包工具最终产出的包体积也影响着开

解析 webpack 核心流程与插件架构，理解： - Webpack 从启动到输出 bundle，内部逻辑流转过程 - 编写 webpack 插件前，你需要弄清楚哪些问题

绝大多数人都在使用 webpack 作为构建工具。那么 loader 作为处理各种资源的工具，大家肯定也不会陌生。很多人没写过 loader，但是都对 loader 的具体怎么写，怎样执行的一无所知。那么本文就对 3.0.0 版本做一个全方位的揭秘。 所谓 loader 只是一…

webpack 的特点之一是处理一切模块，我们可以将逻辑拆分到不同的文件中，然后通过模块化方案进行导出和引入。现在 ES6 的 Module 则是大家最常用的模块化方案，所以你一定写过 import './xxx' 或者 import 'something-in-nodemod…

在用 Webpack 处理打包时，可将某一目录配置一个别名，代码中就能使用与别名的相对路径引用资源。 这样我们就可以在 js 文件中用形如 import tool from '@/utils/xxx' 的方式引用 /src/utils/xxx.js 文件，并且 Webpack …

而关于如何应用该路径并没有说清楚... 这个最终静态资源访问路径在使用html-webpack-plugin打包后得到的html中可以看到。所以publicPath设置成相对路径后，相对路径是相对于build之后的index.html的，例如，如果设置publicPath: '…

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

带你深度解锁Webpack系列(基础篇) 和 带你深度解锁Webpack系列(进阶篇)，主要是讲解了 Webpack 的配置，但是随着项目越来越大，构建速度可能会越来越慢，构建出来的js的体积也越来越大，此时就需要对 Webpack 的配置进行优化。 本文罗列出了十多种优化方式…

webpack本质上是一种事件流的机制，它的工作流程就是将各个插件串联起来，而实现这一切的核心就是Tapable，webpack中最核心的负责编译的Compiler和负责创建bundles的Compilation都是Tapable的实例。本文主要介绍一下Tapable中的钩子函…