webpack 中关于 splitChunks 的几个重点属性的使用场景和解析，结合 bundle analyzer 输出图来分析，快来康康吧~

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

SplitChunks插件是什么呢，简单的来说就是Webpack中一个提取或分离代码的插件，主要作用是提取公共代码，防止代码被重复打包，拆分过大的js文件，合并零散的js文件。 提到前端优化，提取公共代码是必不可少的手段。在Webpack出现前，提取公共代码是人为去处理，而Sp…

其他的非公共代码。 all: 不管文件是动态还是非动态载入，统一将文件分离。当页面首次载入会引入所有的包 async： 将异步加载的文件分离，首次一般不引入，到需要异步引入的组件才会引入。 initial：将异步和非异步的文件分离，如果一个文件被异步引入也被非异步引入，那它会被…

基于已有项目从webpack打包层面优化代码体积等，主要分享优化的思路，项目结构：pc和mobile集成在一个项目中，PC端：element-ui + vue(部分页面会用到vant + jkUI)。

前言 大家好，我是林三心，用最通俗易懂的话讲最难的知识点是我的座右铭，基础是进阶的前提是我的初心 当年的校招 依稀记得，当年我参加了大厂的校招，面试的是网易雷火工作室，当时有一道题，我记得很清楚，就是

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

知人者智，自知者明，胜人者有力，自胜者强。——老子 在webpack中有三种hash可以配置，分别是hash、chunkhash、contenthash他们是不对的可以针对不同的配置，首相要搞清楚这三种的hash的区别，什么场景下，适合用哪种。 当有多个chunk，形成多个bu…