Claude Code Turborepo with Claude Code
Learn about claude code turborepo using Claude Code. Practical tips and code examples included.
Turborepoモノレポの構築をClaude Codeで加速する
Turborepoは、Vercelが開発する高性能なモノレポビルドシステムです。インクリメンタルビルドとインテリジェントキャッシュにより、大規模プロジェクトでも高速なビルドを維持できます。Claude Codeを活用すれば、Turborepoの複雑な設定も効率的に進められます。
プロジェクトの初期構築
> Turborepoでモノレポを新規作成して。
> 構成:
> - apps/web: Next.js App Router
> - apps/docs: Astroドキュメントサイト
> - packages/ui: 共通UIライブラリ
> - packages/utils: ユーティリティ関数
> - packages/tsconfig: TypeScript設定
Claude Codeが生成する turbo.json の設定例です。
{
"$schema": "https://turbo.build/schema.json",
"globalDependencies": ["**/.env.*local"],
"globalEnv": ["NODE_ENV"],
"pipeline": {
"build": {
"dependsOn": ["^build"],
"outputs": ["dist/**", ".next/**", "out/**"],
"env": ["NEXT_PUBLIC_API_URL"]
},
"dev": {
"cache": false,
"persistent": true
},
"lint": {
"dependsOn": ["^build"]
},
"test": {
"dependsOn": ["^build"],
"outputs": ["coverage/**"]
}
}
}
パイプラインの依存関係設計
Turborepoのパイプラインでは、タスク間の依存関係を dependsOn で宣言します。
> パッケージ間の依存を考慮して、build → test → deploy の
> パイプラインを設計して。型チェックはbuildと並列で実行したい。
{
"pipeline": {
"build": {
"dependsOn": ["^build"],
"outputs": ["dist/**"]
},
"type-check": {
"dependsOn": ["^build"]
},
"test": {
"dependsOn": ["build"],
"outputs": ["coverage/**"]
},
"deploy": {
"dependsOn": ["build", "test", "type-check"],
"cache": false
}
}
}
build と type-check は互いに依存しないため、Turborepoが自動的に並列実行してくれます。
リモートキャッシュの設定
チーム開発ではリモートキャッシュが欠かせません。
> Vercel Remote Cacheを設定して。
> CI環境でも使えるようにしたい。
# Vercelアカウントとリンク
npx turbo login
npx turbo link
# CI環境用の設定(GitHub Actions)
# TURBO_TOKEN と TURBO_TEAM を secrets に設定
# .github/workflows/ci.yml
name: CI
on: [push, pull_request]
env:
TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
jobs:
build:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- uses: pnpm/action-setup@v2
- uses: actions/setup-node@v4
with:
node-version: 20
cache: 'pnpm'
- run: pnpm install
- run: pnpm turbo build lint test --filter=...[HEAD^]
--filter=...[HEAD^] を使うことで、変更のあったパッケージだけをビルド対象にできます。
フィルタリングで効率的な開発
> webアプリだけをdevモードで起動して。
> 依存パッケージのwatchも有効にして。
# 特定のアプリとその依存パッケージのみ実行
pnpm turbo dev --filter=web...
# 変更があったパッケージのみビルド
pnpm turbo build --filter=...[origin/main]
# 特定パッケージを除外
pnpm turbo build --filter=!./apps/docs
キャッシュのデバッグ
ビルドキャッシュが効かない場合、Claude Codeにデバッグを依頼できます。
> turbo buildのキャッシュがヒットしない原因を調査して。
> turbo run build --dry=json の出力を確認して。
# キャッシュステータスの確認
pnpm turbo build --dry=json | jq '.tasks[] | {taskId, cache}'
# 詳細なログ出力
pnpm turbo build --verbosity=2
Summary
Claude Codeを使えば、Turborepoのパイプライン設計やキャッシュ戦略を素早く最適化できます。モノレポ管理の基本やCI/CD設定ガイドも合わせて参考にしてください。
Turborepoの詳しい設定はTurborepo公式ドキュメントを参照してください。
Related Posts
How to Supercharge Your Side Projects with Claude Code [With Examples]
How to Supercharge Your Side Projects with Claude Code [With Examples]. A practical guide with code examples.
How to Automate Refactoring with Claude Code
Learn how to automate refactoring using Claude Code. Includes practical code examples and step-by-step guidance.
Complete CORS Configuration Guide with Claude Code
Learn about complete cors configuration guide using Claude Code. Practical tips and code examples included.