前端代码在使用​webpack​进行打包时，经常会做两种优化：把稳定的库代码（如​react​、​antd​等）与业务代码分离，业务代码的更改不影响用户本地的库代码缓存，同时也把一个大文件拆分成多个文

前端小伙伴都知道，为了降低包大小，经常会把依赖的前端模块独立打包，比如把 vue、vue-router 打到一个单独的包 vendor 中。另外，常会将存在多个路由的复杂页面的每个页面都单独打一个包，只有访问某个页面的时候，再去下载该页面的js包，以此来加快首页的渲染。 无论是…

webpack官网中，有这么一句话，我不是很认同： 可以说，性能优化最重要的部分就是懂得如何分包了。因此，就来谈谈webpack中的分包。

写这篇文章是因为前段时间有人问我，她在面试中面试官问了她，是否了解package.json中的版本问题？安装模块的~、>、^等代表什么意思？她跟我说，平时只是用项目中的npm start启动或者构建项目，真没有一个个了解这么多，当时心态就崩了o(╥﹏╥)oo(╥﹏╥)o，后面面…

希望读过本篇文章，你在看Webpack配置的时候，能在脑中形成Chunk的生成过程。 Chunk不同于entry、 output、module这样的概念，它们对应着Webpack配置对象中的一个字段，Chunk没有单独的配置字段，但是这个词出现在CommonsChunkPlug…

说起路由懒加载，大家很快就知道怎么实现它，但是问到路由懒加载的原理，怕有一部分小伙伴是一头雾水了吧。下面带大家一起去理解路由懒加载的原理。 路由懒加载也可以叫做路由组件懒加载，最常用的是通过import()来实现它。 然后通过Webpack编译打包后，会把每个路由组件的代码分割…

前言 为什么需要vue懒加载（按需加载）？ 学习Vue的时候，各类教程都会告诉我们：Vue的特点是SPA - Single Page Application（单页面应用程序）。 像vue这种单页面应用

最近在对公司的H5项目做重构，涉及到构建优化，由于一些历史原因，项目原先使用的打包工具是饿了么团队开发的 cooking（基于 webpack 做的封装，目前已停止维护了。）如果继续使用，一是项目目前已经比较复杂，现在的构建方式每次打包耗时较长；二是使用一个已经停止维护的工具本…

这篇文章给大家分享一个业内一款出色的包管理器——pnpm。目前 GitHub 已经有 star 9.8k，现在已经相对成熟且稳定了。它由 npm/yarn 衍生而来，但却解决了 npm/yarn 内部潜在的 bug，并且极大了地优化了性能，扩展了使用场景。下面是本文的思维导图:…