压缩项目打包后的体积大小、提升打包速度，是前端性能优化中非常重要的环节，笔者结合工作中的实践总结，梳理出一些常规且有效的性能优化建议

rollup打包产物解析及原理（对比webpack） 上篇： webpack打包产物解析及原理（含cjs/esm/代码分离/懒加载） rollup定位 rollup比webpack晚出2年，对比web

笔者两年前曾写过一篇文章《Webpack4 搭建 Vue 项目》，后来随着 webpack5 和 vue3 的面世，一直想升级下我这个 createVue 项目。

背景 我们项目准备做成微前端项目或者组件库给别的项目组使用 主要提供两种思路进行升级，一种使用官方提供的方法从vue-cli4升级打vue-cli5，另一种是自己搭建一个新的webpack5

这一篇文章将会介绍如何利用 webpack 中的 Loaders 对静态资源做处理，Loaders 是 webpack 的核心概念之一。

上一篇讲到如何处理静态资源，本篇将更进一步，介绍如何打造一个基础而不失效率的开发环境。HtmlWebpackPlugin、Source Map、WDS、HMR。

Babel 版本更新后，很多内容已经发生变化，官方文档也是晦涩难读。本篇将介绍对于项目中 JS 文件的处理。

一、前言 上一篇讲到对JS语法的处理，本篇将介绍 Tree Shaking 。 我们经常会在主文件或者组件文件中引入其他模块中的代码，但实际上我们只用其中的一部分，剩下的代码则不需要引入。然而在默认情

一、前言 上一篇讲到 Tree Shaking 相关的内容，本篇将介绍在不同模式（或称环境）下的打包处理。 二、不同环境下的打包配置 1. 开发环境的配置 2. 生产环境的配置 通过观察，我们会发现不