随着现代前端开发的复杂度和规模越来越庞大，已经不能抛开工程化来独立开发了，如react的jsx代码必须编译后才能在浏览器中使用；又如sass和less的代码浏览器也是不支持的。 而如果摒弃了这些开发框架，那么开发的效率将大幅下降。在众多前端工程化工具中，webpack脱颖而出成…

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

一、什么是 Tree Shaking Tree-Shaking 是一种基于 ES Module 规范的 Dead Code Elimination 技术，它会在运行过程中静态分析模块之间的导入导出，确

序言 说明 DllPlugin 的使用 1. 运行项目结构 1. webpack.dll.config.js 配置实现 上述的代码就是DllPlugin简单的配置，接下来我们会着重讲解下注意点： ou

如果大家看过一些webpack4优化的文章，一定会出现dll动态链接库。它以配置之复杂让众多初学者记忆犹新。今天我会以一个学习者的角度去一步一步探讨webpackdll的配置，最后得出一个完美的解决方

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

Chunk 是什么？Webpack 如何根据 entry、异步模块、runtime 配置组装 Chunk？

配置 绝对路径配置loader 使用resolveLoader.modules配置，进行自动搜索 编写用法 loader是一个函数，会通过loader runner进行调用，函数内通过this调用lo

oh，shit！这个 js 要加载 4.39 秒？看我利用 webpack-bundle-anaylzer 进行包体积优化实战：包括接入步骤 & 案例分析