Bun CLI：一键通吃的 JavaScript 终极武器

🔥 Bun CLI

用一个命令运行一切 --- TypeScript、React、测试、打包、包管理，统统搞定

引言：告别工具链地狱

你是否厌倦了这个场景？

bash 复制代码

npm install          # 包管理
npm run dev          # 启动开发服务器
npm run build        # 打包
npm test             # 测试
npx tsc --noEmit     # 类型检查
npx prettier --write # 格式化

七个工具、七个命令、七份配置文件。 这就是 Node.js 开发者的日常。

Bun 说："够了。"

bash 复制代码

bun install    # 包管理（快 20-30x）
bun dev        # 开发服务器 + 热重载
bun build      # 打包（内置）
bun test       # 测试（内置）
bun index.tsx  # 直接运行 TypeScript + React

一个二进制、一套命令、零配置。 这就是 Bun 的 "CLI-Anything" 理念。

一、核心架构：为什么 Bun 能"一键通吃"

1.1 技术栈解析

组件	Bun	Node.js 生态
JS 引擎	JavaScriptCore (Safari)	V8 (Chrome)
核心语言	Zig	C++
Transpiler	原生 Zig 实现	Babel / tsc / swc
包管理器	内置	npm / yarn / pnpm
打包器	内置	webpack / vite / esbuild
测试框架	内置	jest / vitest
Shell 执行	内置 API	需要 child_process

1.2 单二进制设计哲学

Bun 将所有功能集成在一个可执行文件中：

复制代码

bun 可执行文件
├── JavaScriptCore 运行时
├── Zig 原生 Transpiler
├── 包管理器（npm 替代）
├── 打包器（webpack 替代）
├── 测试框架（jest 替代）
└── Shell API（跨平台）

优势：

无进程间通信开销
内存共享，零拷贝
部署只需一个文件
启动速度提升 4x

1.3 为什么选择 JavaScriptCore

指标	JSC (Bun)	V8 (Node)
启动时间	5ms	20-50ms
内存占用	更低	较高
JIT 优化	适合 CLI	适合长运行

JavaScriptCore 来自 Safari/WebKit，天生适合"启动快、执行快"的 CLI 场景。

二、CLI-Anything：运行一切的魔法

2.1 文件类型支持（开箱即用）

bash 复制代码

# 直接运行，无需配置
bun index.js      # JavaScript
bun index.ts      # TypeScript（无需 tsc）
bun index.jsx     # React JSX（无需 Babel）
bun index.tsx     # React TSX
bun data.json     # JSON 文件
bun script.sh     # Shell 脚本

支持的扩展名 ：
.js .cjs .mjs .ts .tsx .jsx .mts .cts .json .jsonc .json5 .toml .yaml .yml .wasm .node .html .sh

2.2 bun run：脚本执行的瑞士军刀

运行源文件

bash 复制代码

bun run index.tsx
bun index.tsx         # 简写形式（省略 run）

# 传递参数
bun run server.ts --port 3000

# Watch 模式（热重载）
bun --watch run index.tsx

# 减少内存占用
bun --smol run index.tsx

运行 package.json 脚本

bash 复制代码

bun run dev           # 运行 scripts.dev
bun run build         # 运行 scripts.build
bun run               # 查看所有可用脚本

速度对比：

操作	Bun	npm
`run dev`	6ms	170ms

快 28 倍。

解析顺序

bun run <name> 按以下顺序查找：

package.json scripts --- bun run build
源文件 --- bun run src/main.ts
项目依赖的 bin --- bun run eslint
系统命令 --- bun run ls

2.3 bunx：一键执行 npm 包

bash 复制代码

# 类似 npx，但快 100x
bunx cowsay "Hello world!"
bunx my-cli --foo bar

# 强制用 Bun 运行（忽略 shebang）
bunx --bun vite

# 指定包名（当 bin 名称与包名不同）
bunx -p @angular/cli ng

工作原理：

本地已安装 → 直接运行
未安装 → 自动从 npm 下载并缓存
后续运行 → 使用缓存，秒启动

2.4 Bun Shell：JavaScript 中的 Bash

typescript 复制代码

import { $ } from "bun";

// 执行 shell 命令
await $`echo "Hello World!"`;

// 管道操作
await $`echo "Hello" | wc -w`;

// 重定向
await $`cat < myfile.txt`;
await $`echo bun! > greeting.txt`;

// 与 JavaScript 互操作
const response = await fetch("https://example.com");
await $`cat < ${response} | wc -c`;

// Glob 模式
await $`rm -rf dist/**/*.{js,ts}`;

特性：

跨平台（Windows、Linux、macOS）
默认字符串转义（防 shell injection）
支持 JavaScript 对象作为输入输出

2.5 stdin 执行

bash 复制代码

# 从 stdin 读取并执行
echo "console.log('Hello')" | bun run -

# 将 .js 文件当作 TypeScript 运行
bun run - < secretly-typescript.js

三、内置工具链：告别 babel、jest、webpack

3.1 包管理器

bash 复制代码

bun install                    # 安装所有依赖
bun install --production       # 仅生产依赖
bun install --frozen-lockfile  # CI 模式

bun add lodash                 # 添加依赖
bun add -d typescript          # 添加开发依赖
bun add -g prettier            # 全局安装

bun remove lodash              # 移除依赖
bun update                     # 更新依赖
bun outdated                   # 检查过时依赖

命令对照表：

Bun	npm	yarn	pnpm
`bun install`	`npm install`	`yarn`	`pnpm install`
`bun add`	`npm i`	`yarn add`	`pnpm add`
`bun add -d`	`npm i -D`	`yarn add -D`	`pnpm add -D`
`bun remove`	`npm uninstall`	`yarn remove`	`pnpm remove`
`bun update`	`npm update`	`yarn upgrade`	`pnpm update`

性能对比：

操作	Bun	npm	pnpm
冷缓存安装	基准	20x 更慢	5x 更慢
热缓存安装	基准	30x 更慢	10x 更慢

3.2 测试框架

bash 复制代码

bun test                        # 运行所有测试
bun test --watch                # 监听模式
bun test --coverage             # 覆盖率报告
bun test --bail                 # 首次失败退出
bun test --timeout 5000         # 设置超时
bun test --only                 # 仅运行 .only 标记
bun test --update               # 更新快照

Jest 兼容 API：

typescript 复制代码

import { test, expect, describe, beforeEach } from "bun:test";

describe("MyModule", () => {
  beforeEach(() => {
    // setup
  });

  test("example", () => {
    expect(1 + 1).toBe(2);
    expect([1, 2, 3]).toContain(2);
    expect(() => throw Error()).toThrow();
  });

  test.skip("skip this", () => {});
  test.only("only this", () => {});
});

特性：

Jest 兼容断言
快照测试
Mock 功能
默认并行执行
零配置 TypeScript

3.3 打包器

bash 复制代码

bun build ./src/index.ts --outdir ./dist
bun build ./src/index.ts --outfile ./bundle.js
bun build ./src/index.ts --minify        # 压缩
bun build ./src/index.ts --target browser
bun build ./src/index.ts --target node
bun build ./src/index.ts --format esm
bun build ./src/index.ts --sourcemap
bun build ./src/index.ts --external react

目标环境：

browser --- 浏览器
node --- Node.js
bun --- Bun 运行时

输出格式：

esm --- ES Modules
cjs --- CommonJS
iife --- 立即执行函数

3.4 开发服务器

bash 复制代码

bun dev                  # 启动开发服务器
bun --hot run server.ts  # 热重载

热重载特性：

文件变化自动重运行
保持进程状态（可选）
快速重启（< 50ms）

四、Transpiler 深度解析

4.1 工作流程

复制代码

源文件 (TS/TSX)
        ↓
    文件读取
        ↓
    Zig 解析器 (src/js_parser.zig)
        ↓
    AST 转换
  ├── 类型擦除 (Type Stripping)
  ├── JSX → JS 转换
  └── ESM/CommonJS 互操作
        ↓
    代码生成
        ↓
    字节码编译 (JSC)
        ↓
    执行

4.2 类型擦除（Type Stripping）

Bun 不进行完整类型检查，而是"擦除"类型：

typescript 复制代码

// 输入
interface Props { name: string; }
function App({ name }: Props) {
  return <div>Hello, {name}!</div>;
}

// 输出（擦除后）
function App({ name }) {
  return React.createElement("div", null, "Hello, ", name, "!");
}

为什么这样设计：

类型检查交给 IDE / tsc --noEmit
运行时只做擦除，极大提速
开发者获得即时反馈

4.3 性能数据

Transpiler	TypeScript	JSX
Bun (Zig)	最快	最快
esbuild	非常快	非常快
swc	快	快
Babel	慢	慢
tsc	最慢	不支持

五、实战案例

5.1 快速创建项目

bash 复制代码

bun init                    # 初始化新项目
bun create react            # 创建 React 项目
bun create next             # 创建 Next.js 项目

5.2 一键开发环境

bash 复制代码

# 安装依赖
bun add react react-dom
bun add -d @types/react

# 创建文件
cat > App.tsx << 'EOF'
export function App() {
  return <h1>Hello Bun!</h1>;
}
EOF

# 运行
bun App.tsx

5.3 测试驱动开发

bash 复制代码

# 创建测试
cat > math.test.ts << 'EOF'
import { test, expect } from "bun:test";

test("addition", () => {
  expect(1 + 1).toBe(2);
});

test("multiplication", () => {
  expect(2 * 3).toBe(6);
});
EOF

# 运行测试（watch 模式）
bun test --watch

5.4 生产构建

bash 复制代码

# 打包
bun build ./src/index.ts --outdir ./dist --minify --sourcemap

# 创建独立可执行文件
bun build ./src/index.ts --compile --outfile my-app
./my-app                   # 直接运行

六、与 Node.js/npm 对比

维度	Bun	Node.js
哲学	一体化	Unix 小工具组合
安装速度	20-30x 更快	基准
启动速度	4x 更快	基准
TypeScript	原生支持	需要 tsc
JSX	原生支持	需要 Babel
测试	内置	需要 jest
打包	内置	需要 webpack
配置	零配置	多份配置
生态	新兴	15+ 年成熟

七、迁移指南

7.1 从 npm 迁移

bash 复制代码

# 1. 安装 Bun
curl -fsSL https://bun.sh/install | bash

# 2. 在现有项目运行
bun install              # 自动读取 package.json

# 3. 验证
bun test                 # 运行测试
bun run dev              # 运行开发脚本

7.2 兼容性检查

大多数 npm 包直接兼容
查阅 Node.js Compatibility
原生模块 (.node) 需重新编译
特定 Node.js API 可能有差异

八、参考资料

官方文档

Bun CLI Reference --- CLI 完整参考
Bun Runtime --- 运行时文档
Bun Package Manager --- 包管理器
Bun Test --- 测试框架
Bun Build --- 打包器

GitHub

oven-sh/bun --- 源码仓库

技术深潜

Bun Architecture
Why Zig --- 设计决策
JavaScriptCore vs V8 --- 技术对比

结语

Bun 的 CLI-Anything 理念简单而强大：

一个命令、一个工具、一切搞定。

这不是关于"更快"（虽然确实快）。这是关于简化。

从 npm run build && npm test && npm run dev 到 bun build && bun test && bun dev。

从 7 个工具到 1 个。

从"配置地狱"到"零配置天堂"。

Bun 让 JavaScript 开发回归本质：写代码，运行代码。