前言 本篇文章不只是搭建webpack5的项目，还有个更重要的目的是，为了在搭建过程中了解每个插件，loader的作用，为什么要使用这些东西，这些东西带来了什么。 我为本项目写了一个cli工具：fig

模块化之争的在 ESM 标准出来的时候已成为定局，这两年前端界也在进行 ESM 大迁移。关于 ESM 个人感觉可以聊的并不多，最近讨论最多的可能还是到底该不该用 default import 以及它俩

前端模块化作为前端必备的一个技能，已经在前端开发中不可或缺；而模块化带来项目的规模不断变大，项目的依赖越来越多；随着项目的增多，如果每个模块都通过手动拷贝的方式无异于饮鸩止渴。

之前在网络上查找过相关的rollup使用，有些文章很概念不易理解，没有具体步骤；有些文章步骤不够详细，没有来龙去脉。所以打算整理个文章给后来者减少弯路。我保证此文真的是手把手教学，很接地气，因为我是边

CJS 原理 ESM 原理 CJS 加载 ESM 原理 ESM 加载 CJS 的原理 import() 异步打包原理

如何解析 jsx 我们知道一个 react 组件是 jsx 是要通过 babel 解析成一个普通的 js 对象。我们需要下面工具包 @babel/core @babel/node @babel/pre

原文自定义jsx解析工厂函数 问题 我们通常会在react项目中使用jsx，当我们习惯了jsx的语法之后，可能就脱离不开jsx了，如果我们不在react而是在一个原生js项目中也想使用jsx怎么办呢？

本文适合2~4年的前端开发人员的进阶，且对vue或者react搭配webpack有一定的经验。如果webpack的基本使用都未了解，建议实践后再看本文。 本文是原创，均为本人手写。部分思维, 借鉴了“宫小白”的webpack文章。文章结尾标注了“感谢”。 此前有人关心博客源码的…

本文会通过手写一个非常简单的乞丐版`Vite`来了解一下`Vite`的基本实现原理。分为上下两篇，上篇主要讨论如何成功运行项目，下篇主要讨论热更新。