Bun CLI:一键通吃的 JavaScript 终极武器
Bun CLI用一个命令运行一切 — TypeScript、React、测试、打包、包管理统统搞定引言告别工具链地狱你是否厌倦了这个场景npminstall# 包管理npmrun dev# 启动开发服务器npmrun build# 打包npmtest# 测试npx tsc--noEmit# 类型检查npx prettier--write# 格式化七个工具、七个命令、七份配置文件。这就是 Node.js 开发者的日常。Bun 说“够了。”buninstall# 包管理快 20-30xbun dev# 开发服务器 热重载bun build# 打包内置buntest# 测试内置bun index.tsx# 直接运行 TypeScript React一个二进制、一套命令、零配置。这就是 Bun 的 “CLI-Anything” 理念。一、核心架构为什么 Bun 能一键通吃1.1 技术栈解析组件BunNode.js 生态JS 引擎JavaScriptCore (Safari)V8 (Chrome)核心语言ZigCTranspiler原生 Zig 实现Babel / tsc / swc包管理器内置npm / yarn / pnpm打包器内置webpack / vite / esbuild测试框架内置jest / vitestShell 执行内置 API需要 child_process1.2 单二进制设计哲学Bun 将所有功能集成在一个可执行文件中bun 可执行文件 ├── JavaScriptCore 运行时 ├── Zig 原生 Transpiler ├── 包管理器npm 替代 ├── 打包器webpack 替代 ├── 测试框架jest 替代 └── Shell API跨平台优势无进程间通信开销内存共享零拷贝部署只需一个文件启动速度提升 4x1.3 为什么选择 JavaScriptCore指标JSC (Bun)V8 (Node)启动时间5ms20-50ms内存占用更低较高JIT 优化适合 CLI适合长运行JavaScriptCore 来自 Safari/WebKit天生适合启动快、执行快的 CLI 场景。二、CLI-Anything运行一切的魔法2.1 文件类型支持开箱即用# 直接运行无需配置bun index.js# JavaScriptbun index.ts# TypeScript无需 tscbun index.jsx# React JSX无需 Babelbun index.tsx# React TSXbun data.json# JSON 文件bun script.sh# Shell 脚本支持的扩展名.js.cjs.mjs.ts.tsx.jsx.mts.cts.json.jsonc.json5.toml.yaml.yml.wasm.node.html.sh2.2 bun run脚本执行的瑞士军刀运行源文件bun run index.tsx bun index.tsx# 简写形式省略 run# 传递参数bun run server.ts--port3000# Watch 模式热重载bun--watchrun index.tsx# 减少内存占用bun--smolrun index.tsx运行 package.json 脚本bun run dev# 运行 scripts.devbun run build# 运行 scripts.buildbun run# 查看所有可用脚本速度对比操作Bunnpmrun dev6ms170ms快28 倍。解析顺序bun run name按以下顺序查找package.json scripts—bun run build源文件—bun run src/main.ts项目依赖的 bin—bun run eslint系统命令—bun run ls2.3 bunx一键执行 npm 包# 类似 npx但快 100xbunx cowsayHello world!bunx my-cli--foobar# 强制用 Bun 运行忽略 shebangbunx--bunvite# 指定包名当 bin 名称与包名不同bunx-pangular/cli ng工作原理本地已安装 → 直接运行未安装 → 自动从 npm 下载并缓存后续运行 → 使用缓存秒启动2.4 Bun ShellJavaScript 中的 Bashimport{$}frombun;// 执行 shell 命令await$echo Hello World!;// 管道操作await$echo Hello | wc -w;// 重定向await$cat myfile.txt;await$echo bun! greeting.txt;// 与 JavaScript 互操作constresponseawaitfetch(https://example.com);await$cat ${response}| wc -c;// Glob 模式await$rm -rf dist/**/*.{js,ts};特性跨平台Windows、Linux、macOS默认字符串转义防 shell injection支持 JavaScript 对象作为输入输出2.5 stdin 执行# 从 stdin 读取并执行echoconsole.log(Hello)|bun run -# 将 .js 文件当作 TypeScript 运行bun run -secretly-typescript.js三、内置工具链告别 babel、jest、webpack3.1 包管理器buninstall# 安装所有依赖buninstall--production# 仅生产依赖buninstall--frozen-lockfile# CI 模式bunaddlodash# 添加依赖bunadd-dtypescript# 添加开发依赖bunadd-gprettier# 全局安装bun remove lodash# 移除依赖bun update# 更新依赖bun outdated# 检查过时依赖命令对照表Bunnpmyarnpnpmbun installnpm installyarnpnpm installbun addnpm iyarn addpnpm addbun add -dnpm i -Dyarn add -Dpnpm add -Dbun removenpm uninstallyarn removepnpm removebun updatenpm updateyarn upgradepnpm update性能对比操作Bunnpmpnpm冷缓存安装基准20x 更慢5x 更慢热缓存安装基准30x 更慢10x 更慢3.2 测试框架buntest# 运行所有测试buntest--watch# 监听模式buntest--coverage# 覆盖率报告buntest--bail# 首次失败退出buntest--timeout5000# 设置超时buntest--only# 仅运行 .only 标记buntest--update# 更新快照Jest 兼容 APIimport{test,expect,describe,beforeEach}frombun:test;describe(MyModule,(){beforeEach((){// setup});test(example,(){expect(11).toBe(2);expect([1,2,3]).toContain(2);expect(()throwError()).toThrow();});test.skip(skip this,(){});test.only(only this,(){});});特性Jest 兼容断言快照测试Mock 功能默认并行执行零配置 TypeScript3.3 打包器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--targetbrowser bun build ./src/index.ts--targetnodebun build ./src/index.ts--formatesm bun build ./src/index.ts--sourcemapbun build ./src/index.ts--externalreact目标环境browser— 浏览器node— Node.jsbun— Bun 运行时输出格式esm— ES Modulescjs— CommonJSiife— 立即执行函数3.4 开发服务器bun dev# 启动开发服务器bun--hotrun server.ts# 热重载热重载特性文件变化自动重运行保持进程状态可选快速重启 50ms四、Transpiler 深度解析4.1 工作流程源文件 (TS/TSX) ↓ 文件读取 ↓ Zig 解析器 (src/js_parser.zig) ↓ AST 转换 ├── 类型擦除 (Type Stripping) ├── JSX → JS 转换 └── ESM/CommonJS 互操作 ↓ 代码生成 ↓ 字节码编译 (JSC) ↓ 执行4.2 类型擦除Type StrippingBun 不进行完整类型检查而是擦除类型// 输入interfaceProps{name:string;}functionApp({name}:Props){returndivHello,{name}!/div;}// 输出擦除后functionApp({name}){returnReact.createElement(div,null,Hello, ,name,!);}为什么这样设计类型检查交给 IDE /tsc --noEmit运行时只做擦除极大提速开发者获得即时反馈4.3 性能数据TranspilerTypeScriptJSXBun (Zig)最快最快esbuild非常快非常快swc快快Babel慢慢tsc最慢不支持五、实战案例5.1 快速创建项目bun init# 初始化新项目bun create react# 创建 React 项目bun create next# 创建 Next.js 项目5.2 一键开发环境# 安装依赖bunaddreact react-dom bunadd-dtypes/react# 创建文件catApp.tsxEOF export function App() { return h1Hello Bun!/h1; } EOF# 运行bun App.tsx5.3 测试驱动开发# 创建测试catmath.test.tsEOF import { test, expect } from bun:test; test(addition, () { expect(1 1).toBe(2); }); test(multiplication, () { expect(2 * 3).toBe(6); }); EOF# 运行测试watch 模式buntest--watch5.4 生产构建# 打包bun build ./src/index.ts--outdir./dist--minify--sourcemap# 创建独立可执行文件bun build ./src/index.ts--compile--outfilemy-app ./my-app# 直接运行六、与 Node.js/npm 对比维度BunNode.js哲学一体化Unix 小工具组合安装速度20-30x 更快基准启动速度4x 更快基准TypeScript原生支持需要 tscJSX原生支持需要 Babel测试内置需要 jest打包内置需要 webpack配置零配置多份配置生态新兴15 年成熟七、迁移指南7.1 从 npm 迁移# 1. 安装 Buncurl-fsSLhttps://bun.sh/install|bash# 2. 在现有项目运行buninstall# 自动读取 package.json# 3. 验证buntest# 运行测试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 — 打包器GitHuboven-sh/bun — 源码仓库技术深潜Bun ArchitectureWhy 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 开发回归本质写代码运行代码。