在前端开发中，我们通常会使用打包工具（如 Vite、Webpack）将 JS/CSS 等资源构建上线，并配合 CDN、浏览器缓存来加速访问。但问题也随之而来： 原因很简单：用户浏览器缓存了旧的静态资源

本项目主要以 create-vue 源码为蓝本，create-react-app 源码及其它文章为辅助进行实现，和笔者一起在掌握原理的同时也搭建一个属于自己的脚手架工具吧 ~

阿里三面的时候被问到了这个问题，当时思路虽然正确，可惜表述的不够清晰 后来花了一些时间整理了下思路，那么如何实现给所有的async函数添加try/catch呢？

打包体积优化！！！优化一半！！首次加载速度优化！！优化一半！！要让我们的项目fast fast fast！！

当项目越来越复杂时，会面临着构建速度慢和构建出来的文件体积大的问题。webapck构建优化对于大项目是必须要考虑的一件事，下面我们就从速度和体积两方面来探讨构建优化的策略。 分析工具 在优化之前，我们

本文已收录在Github github.com/Geekhyt，欢迎Star。 从头发的浓密程度和干练的走路姿势我察觉到，面前坐着的这位面试官也是一把好手。我像以往一样，准备花3分钟的时间进行自我介绍。在此期间，我的目光被16寸的MacBook Pro所吸引，这次的自我介绍我做…

1. 基础 -- 会配置 2. 进阶 -- 能优化 3. 深入 -- 懂原理 一层层晋级打怪 🦖 ，解答不同深度的 Webpack 面试题问题 🤓

这里所述的组件库动态加载和 webpack 构建项目的懒加载是不同的，此文将以 babel-plugin-import 插件为主，讲解组件库按需加载方案的实现原理。

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