Bun 打包基础 #

概述 #

Bun 内置了高性能打包器，可以快速打包 JavaScript、TypeScript 和 JSX 代码，无需 Webpack 或 Rollup。

基本用法 #

命令行打包 #

bash

# 基本打包
bun build ./src/index.ts --outdir ./dist

# 指定输出文件
bun build ./src/index.ts --outfile ./dist/bundle.js

# 压缩代码
bun build ./src/index.ts --outdir ./dist --minify

# 生成 Source Map
bun build ./src/index.ts --outdir ./dist --sourcemap

输出格式 #

bash

# ES 模块（默认）
bun build ./src/index.ts --outdir ./dist --format esm

# CommonJS
bun build ./src/index.ts --outdir ./dist --format cjs

# IIFE（立即执行函数）
bun build ./src/index.ts --outdir ./dist --format iife

目标环境 #

bash

# 浏览器（默认）
bun build ./src/index.ts --outdir ./dist --target browser

# Node.js
bun build ./src/index.ts --outdir ./dist --target node

# Bun
bun build ./src/index.ts --outdir ./dist --target bun

编程式 API #

基本打包 #

typescript

import { build } from "bun";

const result = await build({
  entrypoints: ["./src/index.ts"],
  outdir: "./dist",
  minify: true,
  sourcemap: "external",
});

if (!result.success) {
  console.error("Build failed:", result.logs);
}

完整配置 #

typescript

import { build } from "bun";

const result = await build({
  entrypoints: ["./src/index.ts"],
  outdir: "./dist",
  target: "browser",
  format: "esm",
  minify: {
    whitespace: true,
    identifiers: true,
    syntax: true,
  },
  sourcemap: "external",
  splitting: true,
  external: ["react", "react-dom"],
  define: {
    "process.env.NODE_ENV": JSON.stringify("production"),
  },
  plugins: [],
});

console.log(result.outputs);

打包为可执行文件 #

bash

# 打包为可执行文件
bun build ./src/cli.ts --compile --outfile myapp

# 跨平台编译
bun build ./src/cli.ts --compile --target=bun-linux-x64 --outfile myapp-linux
bun build ./src/cli.ts --compile --target=bun-darwin-arm64 --outfile myapp-macos
bun build ./src/cli.ts --compile --target=bun-windows-x64 --outfile myapp.exe

配置文件 #

build.config.ts #

typescript

export default {
  entrypoints: ["./src/index.ts"],
  outdir: "./dist",
  target: "browser",
  format: "esm",
  minify: true,
  sourcemap: "external",
  splitting: true,
  external: ["react", "react-dom"],
  define: {
    NODE_ENV: "production",
  },
};

bash

bun build --config build.config.ts

下一步 #

现在你已经了解了 Bun 打包基础，接下来学习插件系统了解如何扩展打包功能。