通过第一节的学习我们知道完成第一步骤解析完AST后，接下来是进入转换，插件在这个阶段就起到关键作用了。 答：presets是预设，举个例子：有一天树酱要去肯德基买鸡翅、薯条、可乐、汉堡。然后我发现有个套餐A包含了(薯条、可乐、汉堡)，那这个present就相当于套餐A，它包含了…

一. 什么是Tree-shaking 上图形象的解释了Tree-shaking 的本意，本文所说的前端中的tree-shaking可以理解为通过工具"摇"我们的JS文件，将其中用不到的代码"摇"掉，是一个性能优化的范畴。具体来说，在 webpack 项目中，有一个入口文件，相当…

对于一个应用来说，如果资源体积过大，那么势必会影响到性能。所以我们会绞尽脑汁想着去提升应用的性能，而CDN就是一种手段。对于一些提供了CDN的第三方库，我们完全可以不用通过npm的形式安装到项目里，而是以CDN方式引入。这样做无疑可以减少资源打包体积，而且应用响应速度更快。 C…

每一个loader都是无状态的，确保loader在不同模块转换之间不保存状态。

最近在做一个玩具，其中用到了vue结构。 本文主要简单介绍下Webpack的loader具体做了些什么，然后简单解析一下vue-loader。 首先先介绍一下Webpack的loader究竟是什么，按照官网的说法，简单来说loader是让其他类型的文件转换成webpack能理解…

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

对 Babel 的配置项的作用不那么了解，是否会影响日常开发呢？老实说，大多情况下没有特别大的影响（毕竟有搜索引擎）。 不过呢，还是想更进一步了解下，于是最近认真阅读了 Babel 的文档，外加不断编译验证，输出了本篇文章，为了更好的阅读体验，修修改改，最终算是以我个人比较喜欢…

三篇长文带你解锁 Webpack ，希望读完这三篇文章，你能够对 webpack 的各项配置有一个更为清晰的认识。 webpack 是一个现代 JavaScript 应用程序的静态模块打包器，当 webpack 处理应用程序时，会递归构建一个依赖关系图，其中包含应用程序需要的每…

三篇长文，带你解锁 Webpack ，希望读完这三篇文章，你能够对 webpack 的各项配置有一个更为清晰的认识。 本文是第二篇，如果你还没有阅读《带你深度解锁Webpack系列(基础篇)》，建议阅读之后，再继续阅读本文。 本文会引入更多的 webpack 配置，如果文中有任…