webpack 对于每个前端儿来说都不陌生，它将每个静态文件当成一个模块，经过一系列的处理为我们整合出最后的需要的 js、css、图片、字体等文件。来自官网的图很形象的阐述了 webpack 的功能 —— bundle js / css / ... （打包全世界ヾ(◍°∇°◍)…

将你的配置信息写到多个分散的文件中去，然后在执行webpack的时候利用--config参数指定要加载的配置文件，配置文件利用moduleimports导出。你可以在webpack/react-starter 看到是使用这种发方法的。 调用第三方的webpack工具，使用其集成…

webpack是一个强大而复杂的前端自动化工具。其中一个特点就是配置复杂，这也使得「webpack配置工程师」这种戏谑的称呼开始流行🤷但是，难道你真的只满足于玩转webpack配置么？ 显然不是。在学习如何使用webpack之外，我们更需要深入webpack内部，探索各部分的…

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

今天我主要分享的是一些 webpack 中的易混淆知识点，也是面试的常见内容。我把这些分散在文档和教程里的内容总结起来，目前看是全网独一份，大家可以加个收藏，方便以后检索和学习

编译后的文件跟我们的源文件不太一样了，原本的内容被放到了一个function(module, exports){}函数里，而最外层多了一个webpackJsonp的执行代码。那么问题来了： 这就是bootstrap的作用了。如果不用code split把bootstrap单独分…

上一篇总览 我们介绍了 webpack 整体的编译过程，这次就来分析下基础的 Tapable。 webpack 整个编译过程中暴露出来大量的 Hook 供内部/外部插件使用，同时支持扩展各种插件，而内部处理的代码，也依赖于 Hook 和插件，这部分的功能就依赖于 Tapable…

hello~亲爱的看官老爷们大家好~ 最近一直在学习 webpack 的相关知识，当清晰地领悟到 webpack 就是不同 loader 和 plugin 组合起来打包之后，只作为工具使用而言，算是入门了。当然，在过程中碰到数之不尽的坑，也产生了想要深入一点了解 webpack…

本项目是淘系用户增长团队的一个大中台系统，单页应用，涵盖很多业务功能，运用了很多懒加载页面组件来提升性能，首屏时间 1s 左右，体验良好。然而大项目文件很多，导致构建和发布时间很长，内存占用较大。我的任务是尽可能优化与此相关的问题。 首先不难发现问题并不在用户体验上，而在于开发…