基本介绍 持久化缓存是 webpack5 所带来的非常强大的特性之一。一句话概括就是构建结果持久化缓存到本地的磁盘，二次构建(非 watch 模块)直接利用磁盘缓存的结果从而跳过构建过程当中的 res

目前，几乎所有业务的开发构建都会用到 webpack 。的确，作为模块加载和打包神器，只需配置几个文件，加载各种 loader 就可以享受无痛流程化开发。但对于 webpack 这样一个复杂度较高的插件集合，它的整体流程及思想对我们来说还是很透明的。那么接下来我会带你了解 webpack 这样一个构建黑盒，首先来谈谈它的流程。

之前讲的是构建性能，这里是细粒度更高的性能优化，主要是还是体现在构建速度提升上，之前主要是对标生产环境，这里主要是对标开发环境。

webpack 是我们现阶段要掌握的重要的打包工具之一，我们知道 webpack 会递归的构建依赖关系图，其中包含应用程序的每个模块，然后将这些模块打包成一个或者多个 bundle。 莫慌，我们一点点拆分开看，其实总体的文件就是一个 IIFE——立即执行函数。 函数的入参 mo…

本系列第一篇，手动初始化vue3+ts项目，并用webpack5实现基础的vue3+ts开发和打包配置。

一、什么是 Source Map 通俗的来说， Source Map 就是一个信息文件，里面存储了代码打包转换后的位置信息，实质是一个 json 描述文件，维护了打包前后的代码映射关系。关于 Sour

一. 什么是 tree-shaking 前端中的 tree-shaking 可以理解为通过工具"摇"我们的 JS 文件，将其中用不到的代码"摇"掉，是一个性能优化的范畴。具体来说，在 webpack

你可能搭建 Webpack 项目很熟悉，配置过各种 loader ,面试官在 Webpack 方面问你，是否自己实现过一个loader?如果没有去了解过如果去实现，小浪来教你写一个简单loader!

webpack在前端界的影响力可谓非常之高，面试时也经常被loader,plugin这些东西折磨，但在真正使用并理解其运行流程之后，它将是一个非常强大的助手