bun-init

Bun プロジェクトの初期化

新しい Bun プロジェクトの初期化を支援します。以下の手順に沿って、適切に構成されたプロジェクトを最適な設定で作成してください。

ワークフロー

1. 前提条件の確認

まず、Bun がインストールされていることを確認します。

bun --version

Bun がインストールされていない場合は、ユーザーのプラットフォームに合わせたインストール手順を案内します。

2. プロジェクトの種類を決定

作成するプロジェクトの種類をユーザーに尋ねます。

• CLI ツール：bin エントリーポイントを備えたコマンドラインアプリケーション
• Web アプリ：React／Vue などを使用するフロントエンドアプリケーション
• API サーバー：ルーティングフレームワークを使用するバックエンド API
• ライブラリ：npm で公開するための再利用可能なパッケージ

3. Bun Init の実行

初期化コマンドを実行します。

bun init -y

以下が作成されます。

• Bun に最適化されたスクリプトを含む package.json
• 推奨される TypeScript 設定を含む tsconfig.json
• エントリーポイントとしての index.ts
• 基本的なプロジェクト情報を記載した README.md

4. TypeScript 設定の拡張

生成された tsconfig.json を読み込み、プロジェクトの種類に合わせて拡張します。

CLI ツールの場合：

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "types": ["bun-types"],
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "allowImportingTsExtensions": true,
    "noEmit": true
  }
}

Web アプリの場合：

{
  "compilerOptions": {
    "target": "ES2022",
    "lib": ["ES2022", "DOM", "DOM.Iterable"],
    "module": "ESNext",
    "moduleResolution": "bundler",
    "jsx": "react-jsx",
    "types": ["bun-types"],
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "allowImportingTsExtensions": true,
    "noEmit": true
  }
}

API サーバーの場合：

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "types": ["bun-types"],
    "strict": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "allowImportingTsExtensions": true,
    "noEmit": true,
    "paths": {
      "@/*": ["./src/*"]
    }
  }
}

ライブラリの場合：

{
  "compilerOptions": {
    "target": "ES2022",
    "module": "ESNext",
    "moduleResolution": "bundler",
    "types": ["bun-types"],
    "strict": true,
    "declaration": true,
    "declarationMap": true,
    "esModuleInterop": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "allowImportingTsExtensions": true,
    "noEmit": true
  }
}

5. プロジェクト構成の作成

適切なディレクトリ構成とファイルを生成します。

CLI ツール：

project/
├── src/
│   ├── index.ts          # Main CLI entry point
│   ├── commands/         # Command handlers
│   └── utils/            # Shared utilities
├── tests/
│   └── index.test.ts
├── package.json
├── tsconfig.json
├── .gitignore
├── .env.example
└── README.md

src/index.ts を作成します。

#!/usr/bin/env bun

console.log("Hello from Bun CLI!");

// Example: Parse command line arguments
const args = process.argv.slice(2);
console.log("Arguments:", args);

bin フィールドを追加するために package.json を更新します。

{
  "bin": {
    "your-cli-name": "./src/index.ts"
  }
}

Web アプリ：

project/
├── src/
│   ├── index.tsx         # App entry point
│   ├── components/       # React components
│   ├── styles/           # CSS/styles
│   └── utils/            # Utilities
├── public/
│   └── index.html
├── tests/
├── package.json
├── tsconfig.json
├── .gitignore
├── .env.example
└── README.md

API サーバー：

project/
├── src/
│   ├── index.ts          # Server entry point
│   ├── routes/           # Route handlers
│   ├── middleware/       # Express/Hono middleware
│   ├── services/         # Business logic
│   └── types/            # TypeScript types
├── tests/
├── package.json
├── tsconfig.json
├── .gitignore
├── .env.example
└── README.md

src/index.ts を作成します。

const server = Bun.serve({
  port: 3000,
  fetch(request) {
    return new Response("Welcome to Bun!");
  },
});

console.log(`Server running at http://localhost:${server.port}`);

ライブラリ：

project/
├── src/
│   ├── index.ts          # Main export
│   └── types.ts          # Type definitions
├── tests/
├── package.json
├── tsconfig.json
├── .gitignore
└── README.md

6. .gitignore の作成

包括的な .gitignore を生成します。

# Bun
node_modules
bun.lockb
*.bun

# Environment
.env
.env.local
.env.*.local

# Build outputs
dist/
build/
*.tsbuildinfo

# Logs
logs
*.log
npm-debug.log*

# OS
.DS_Store
Thumbs.db

# IDE
.vscode/
.idea/
*.swp
*.swo
*~

# Test coverage
coverage/
.nyc_output/

7. 環境変数テンプレートの作成

.env.example を作成します。

# Application
NODE_ENV=development
PORT=3000

# Add your environment variables here
# DATABASE_URL=
# API_KEY=

8. package.json スクリプトの更新

プロジェクトの種類に応じたスクリプトを追加します。

CLI ツール：

{
  "scripts": {
    "dev": "bun run src/index.ts",
    "test": "bun test",
    "lint": "bun run --bun eslint src",
    "typecheck": "bun run --bun tsc --noEmit"
  }
}

Web アプリ：

{
  "scripts": {
    "dev": "bun run --hot src/index.tsx",
    "build": "bun build src/index.tsx --outdir=dist --minify",
    "test": "bun test",
    "typecheck": "bun run --bun tsc --noEmit"
  }
}

API サーバー：

{
  "scripts": {
    "dev": "bun run --hot src/index.ts",
    "start": "bun run src/index.ts",
    "test": "bun test",
    "typecheck": "bun run --bun tsc --noEmit"
  }
}

ライブラリ：

{
  "scripts": {
    "build": "bun build src/index.ts --outdir=dist --minify --sourcemap=external",
    "test": "bun test",
    "typecheck": "bun run --bun tsc --noEmit",
    "prepublishOnly": "bun run build && bun test"
  }
}

9. 一般的な依存関係のインストール

プロジェクトの種類に応じて、一般的な依存関係のインストールを提案します。

CLI ツール：

bun add commander chalk ora
bun add -d @types/node

Web アプリ：

bun add react react-dom
bun add -d @types/react @types/react-dom

API サーバー：

bun add hono
bun add -d @types/node

ライブラリ：

# No default dependencies - user will add as needed

10. 初期テストファイルの作成

tests/ に基本的なテストファイルを作成します。

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

describe("Initial test", () => {
  test("basic assertion", () => {
    expect(1 + 1).toBe(2);
  });
});

初期化後のチェックリスト

セットアップ完了後、ユーザーに以下を提示します。

1. ✅ 作成したプロジェクトの種類の確認
2. ✅ 生成したファイルとディレクトリの一覧
3. ✅ 次の手順：
   • .env.example を .env にコピーして設定する
   • 依存関係のインストールが提案されている場合は、bun install を実行する
   • bun dev を実行して開発を開始する
   • bun test を実行してテストが動作することを確認する

主な設定の原則

• モジュール解決：Bun のネイティブな解決方法を使用するため、"moduleResolution": "bundler" を使用します
• TypeScript の型：常に "types": ["bun-types"] を含めます
• 出力なし：Bun が TypeScript を直接実行するため、"noEmit": true を設定します
• インポート拡張子：.ts のインポートを可能にするため、"allowImportingTsExtensions": true を有効にします
• 厳格モード：コード品質を高めるため、厳格な TypeScript チェックを有効にします

よくある調整

ユーザーがワークスペース（モノレポ）を希望する場合：

package.json に追加します。

{
  "workspaces": ["packages/*"]
}

ユーザーがパスエイリアスを希望する場合：

tsconfig.json に追加します。

{
  "compilerOptions": {
    "paths": {
      "@/*": ["./src/*"],
      "@components/*": ["./src/components/*"]
    }
  }
}

ユーザーが React を使わずに JSX を使いたい場合：

tsconfig.json を更新します。

{
  "compilerOptions": {
    "jsx": "react-jsx",
    "jsxImportSource": "preact" // or other JSX runtime
  }
}

完了

すべてのファイルを作成したら、初期化が完了したことをユーザーに伝え、以下の概要を提示します。

• プロジェクト構成
• 利用可能な npm スクリプト
• 推奨される次の手順
• プロジェクトの種類に応じた Bun ドキュメントへのリンク