rollup on 编程那些事儿

第1章什么是 Rollup

Sat, 28 Mar 2026 11:38:00 +0800

第 1 章　Rollup 是什么

1.1 官方定义：专注于 ES Module 的新一代打包工具

如果把前端世界的打包工具比作一家餐厅，那 Rollup 就是那个只做精品套餐、不卖自助餐的固执大厨。

它的官方定义是这样的：Rollup 是一个 JavaScript 模块打包器（module bundler），专注于 ES Module 语法的打包工具。听起来平平无奇对吧？就像说"这家餐厅是做菜的"一样敷衍。但魔鬼藏在细节里——它的核心卖点是"专注于 ES Module“这五个字。

第2章历史与演进

Sat, 28 Mar 2026 11:38:00 +0800

第 2 章　历史沿革与版本演进

2.1 诞生背景

2008 年，Chrome V8 引擎的诞生让 JavaScript 第一次有了"快"的可能；2015 年，ES6（ES2015）正式落地，JavaScript 有了官方的模块系统。就在这样的时代背景下，一个叫 Rich Harris 的英国小哥，正在为自己的另一个作品——Svelte（2016年正式发布）——寻找一个合适的打包工具。

第2章历史与演进

Sat, 28 Mar 2026 11:38:00 +0800

第 1 章　Rollup 是什么

1.1 官方定义：专注于 ES Module 的新一代打包工具

如果把前端世界的打包工具比作一家餐厅，那 Rollup 就是那个只做精品套餐、不卖自助餐的固执大厨。

第3章有什么用

Sat, 28 Mar 2026 11:38:00 +0800

第 3 章　有什么用

3.1 打包 JavaScript 库 / npm 包

这是 Rollup 最核心的使用场景，也是它的拿手好戏。如果你写了一个工具函数库、一个 UI 组件库，或者任何一个你想发布到 npm 上让其他开发者使用的项目，Rollup 几乎是你能找到的最佳打包方案。为什么这么说？

第4章用在哪里

Sat, 28 Mar 2026 11:38:00 +0800

第 4 章　用在哪里

4.1 开源库 / npm 包发布

如果说 Rollup 是前端构建工具链中的瑞士军刀，那 npm 包发布就是它最闪耀的舞台。为啥？因为 Rollup 天生就是为了"精准投放"而生的——它只想把你写的代码打包成最小可用的形式，不会往包里塞一堆乱七八糟的东西。

第5章怎么使用

Sat, 28 Mar 2026 11:38:00 +0800

第 5 章　怎么用

5.1 环境准备

5.1.1 安装 Node.js（推荐 LTS 版本）

Rollup 是一个 Node.js 的 npm 包，所以第一步当然是要安装 Node.js。

Node.js 是什么？ Node.js 是一个让 JavaScript 可以在服务器端（也就是你的电脑，而不是浏览器）运行的环境。打个比方：如果 JavaScript 是"英语"，那么 Node.js 就是"同声传译设备"，让你能在中国用英语和英国人交流。安装 Rollup 之前，必须先安装 Node.js。

第6章注意事项

Sat, 28 Mar 2026 11:38:00 +0800

第 6 章　需要注意哪些

6.1 Tree-Shaking 的前提条件

Tree-Shaking 是 Rollup 最招牌的功能，但它的效果取决于你如何使用它。理解它的前提条件，可以让你避免踩坑。

6.1.1 必须使用 ES Module 语法（import / export）

Tree-Shaking 只能作用于 ES Module 语法的代码。如果你的代码用的是 CommonJS 语法（require() / module.exports），Tree-Shaking 基本上无法工作。

第7章相关配置

Sat, 28 Mar 2026 11:38:00 +0800

第 7 章　相关配置

7.1 输入配置（Input）

输入配置决定了"从哪里开始打包"，是整个 Rollup 配置的起点。

7.1.1 input：入口文件路径（字符串 / 对象多入口 / 数组）

input 是必填项（什么？你想不写？Rollup 会毫不客气地报错），它告诉 Rollup"从哪里开始找代码"。

rollup on 编程那些事儿

第1章 什么是 Rollup

第 1 章 Rollup 是什么

1.1 官方定义：专注于 ES Module 的新一代打包工具

第2章 历史与演进

第 2 章 历史沿革与版本演进

2.1 诞生背景

第2章 历史与演进

第 1 章 Rollup 是什么

1.1 官方定义：专注于 ES Module 的新一代打包工具

第3章 有什么用

第 3 章 有什么用

3.1 打包 JavaScript 库 / npm 包

第4章 用在哪里

第 4 章 用在哪里

4.1 开源库 / npm 包发布

第5章 怎么使用

第 5 章 怎么用

5.1 环境准备

5.1.1 安装 Node.js（推荐 LTS 版本）

第6章 注意事项

第 6 章 需要注意哪些

6.1 Tree-Shaking 的前提条件

6.1.1 必须使用 ES Module 语法（import / export）

第7章 相关配置

第 7 章 相关配置

7.1 输入配置（Input）

7.1.1 input：入口文件路径（字符串 / 对象多入口 / 数组）

第1章什么是 Rollup

第 1 章　Rollup 是什么

第2章历史与演进

第 2 章　历史沿革与版本演进

第2章历史与演进

第 1 章　Rollup 是什么

第3章有什么用

第 3 章　有什么用

第4章用在哪里

第 4 章　用在哪里

第5章怎么使用

第 5 章　怎么用

第6章注意事项

第 6 章　需要注意哪些

第7章相关配置

第 7 章　相关配置