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

前段时间在某个项目进行需求开发的时候，该项目是基于 webpack3 进行打包构建的。在开发过程中我发现打包很慢，开发体验不佳，于是做了简单的优化并梳理了优化方案 进行优化的第一步需要知道我们的构建到底慢在那里。通过 speed-measure-webpack-plugin 测…

webpack 打包优化并没有什么固定的模式，一般我们常见的优化就是拆包、分块、压缩等，并不是对每一个项目都适用，针对于特定项目，需要不断调试不断优化。 对于 webpack4，建议从零开始配置，在项目初期，使用 webpack4 默认的配置。 接下来，本篇文章会列出所有适用于…

这一章讲打包体积优化，这个也算是最重要的一章了，我之前可是花了很多时间去查资料怎么优化打包体积的，不同版本的webpack之间还有一些区别，所以也算踩了很多的坑，所以这一章会比较长。 可以清晰的看到antd和react-dom就占了一半多，下面来优化。 1. 修改mode 2.…

由于前后端分离的前端应用脱离了后端的支持，在单独开发前端应用时，页面调试时使用固定的开发环境地址还好，如果出现在本地开发时需要调试不同环境的远端API，或者需要将应用部署到不同环境的服务器上时，如果不将这些环境对应的服务器地址、环境专属变量等单独配置，也许每次切换环境都需要修改…

作者：滴滴公共前端团队 - 水乙 我们在使用 webpack 打包我们的工程模块时，经常会需要 devtool 开启 sourceMap 让我们可以调试代码，但是 webpack 文档中关于 devtool 给出了7种模式，文档也写得非常简略，初学者很难上手。本文将这7种模式的…