メインコンテンツへスキップ
Think You Lab
ブログログイン無料で始める
トップ/ブログ/how-to
Claude Codeエラー修正TypeScriptESLintデバッグ

Claude Code でエラーを自動修正させる方法 — TypeScript・ESLint・テスト失敗まで対応

Claude Code にエラーメッセージを渡して自動修正させる手順を解説。TypeScript・ESLint・テスト失敗それぞれの渡し方と、修正が上手くいかないときの対処法を説明します。

2026-04-15·約8分

LINE 公式アカウント

n8n自動化テンプレを無料配布中。LINEで受け取る

目次
  • Claude Code へのエラーの渡し方(基本)
  • エラーメッセージをそのままコピペして渡す
  • ファイルとエラーを一緒に渡す
  • 「修正してから原因を説明して」という指示パターン
  • エラー種別ごとの対処パターン
  • TypeScript 型エラー
  • ESLint エラー
  • テスト失敗(jest / vitest)
  • ランタイムエラー(スタックトレース)
  • ワンショットモードでの半自動化
  • 修正が上手くいかないときの対処
  • 同じエラーが繰り返される
  • 修正が別のエラーを生む
  • THINK YOU LAB での実際のフロー
  • まとめ

目次

  • Claude Code へのエラーの渡し方(基本)
  • エラーメッセージをそのままコピペして渡す
  • ファイルとエラーを一緒に渡す
  • 「修正してから原因を説明して」という指示パターン
  • エラー種別ごとの対処パターン
  • TypeScript 型エラー
  • ESLint エラー
  • テスト失敗(jest / vitest)
  • ランタイムエラー(スタックトレース)
  • ワンショットモードでの半自動化
  • 修正が上手くいかないときの対処
  • 同じエラーが繰り返される
  • 修正が別のエラーを生む
  • THINK YOU LAB での実際のフロー
  • まとめ

エラーが出たとき、まず Claude Code に渡してみてください。

「エラーメッセージをコピーして @ファイル名 を付けて渡す」という操作だけで、多くのケースで修正案が返ってきます。

この記事で学ぶこと:

  1. エラーメッセージを Claude Code に渡す基本手順
  2. TypeScript・ESLint・テスト失敗それぞれの渡し方
  3. 修正が上手くいかないときの対処パターン
  4. ワンショットモードでの半自動化

著者の立場: THINK YOU LAB の Next.js + Supabase LMS 開発で Claude Code を実務使用しています。TypeScript 型エラー・ESLint エラーのほとんどを Claude Code で修正しており、この記事のパターンは実際の開発で使っているものです。

基本的なファイル操作がまだの方はこちら → Claude Code でファイルを読み書きさせる基本操作


Claude Code へのエラーの渡し方(基本)

エラーメッセージをそのままコピペして渡す

ターミナルに出たエラーメッセージをコピーして、Claude Code のプロンプトに貼り付けます。

> 以下のエラーを修正してください:

TypeError: Cannot read properties of undefined (reading 'map')
    at Component (src/app/page.tsx:24:18)

Claude Code がエラーを読み、原因と修正案を返します。

ファイルとエラーを一緒に渡す

ファイルのコンテキストがある方が、より正確な修正ができます。

> @src/app/page.tsx 以下のエラーを修正してください:

TypeError: Cannot read properties of undefined (reading 'map')
    at Component (src/app/page.tsx:24:18)

エラーが発生しているファイルを @ファイル名 で指定することで、コードを読んだ上で修正案を提示します。

「修正してから原因を説明して」という指示パターン

エラーを修正するだけでなく、原因を理解したい場合は説明も求めます。

> @src/app/page.tsx 以下のエラーを修正してから、
> なぜこのエラーが起きたか3行で説明してください:

TypeError: Cannot read properties of undefined (reading 'map')

修正と学習を同時にできるため、同じエラーを繰り返しにくくなります。


エラー種別ごとの対処パターン

TypeScript 型エラー

tsc の出力をそのまま渡します。

npx tsc --noEmit 2>&1 | head -50

出力されたエラーをコピーして Claude Code に渡します:

> @src/lib/supabase.ts 以下の TypeScript エラーを修正してください:

src/lib/supabase.ts:12:5 - error TS2339: Property 'user' does not exist on type 'Session | null'.

ポイント: 型エラーは複数まとめて渡すより、関連ファイルごとに渡す方が精度が上がります。

ESLint エラー

npx eslint src/components/Button.tsx
> @.eslintrc.json @src/components/Button.tsx 以下の ESLint エラーをすべて修正してください:

5:1  error  'React' must be in scope when using JSX  react/react-in-jsx-scope

ESLint 設定ファイルも一緒に読ませると、修正方針がより適切になります。

テスト失敗(jest / vitest)

npm test 2>&1 | grep -A 20 "FAIL"
> @src/utils/format.test.ts @src/utils/format.ts 以下のテストが失敗しています。
> テストが通るようにソースコードを修正してください(テストは変更しないでください):

FAIL src/utils/format.test.ts
  Expected: "2026-03-15"
  Received: "15/03/2026"

重要: 「テストは変更しないでください」を明示することで、テストをパスさせるためにテスト自体を書き換えるという回避を防げます。

ランタイムエラー(スタックトレース)

> @src/app/api/webhooks/stripe/route.ts 以下のエラーが発生しています。
> スタックトレースを元に原因と修正方法を説明して、修正してください:

Error: STRIPE_WEBHOOK_SECRET is not defined
    at POST (src/app/api/webhooks/stripe/route.ts:8:9)

ワンショットモードでの半自動化

ワンショットモード(claude -p)を使うと、スクリプトからエラーを自動で渡せます。

# TypeScript エラーを自動で修正させる
npx tsc --noEmit 2>&1 | claude -p "@src/ TypeScript エラーをすべて修正してください"

package.json に組み込む例:

{
  "scripts": {
    "fix:types": "npx tsc --noEmit 2>&1 | claude -p 'TypeScript エラーをすべて修正してください'"
  }
}

注意: 自動修正を実行する前に、CLAUDE.md で変更範囲を制限しておくことを強く推奨します。意図しないファイルが変更されるリスクがあります。


修正が上手くいかないときの対処

同じエラーが繰り返される

修正より先に原因分析をさせます。

> @src/app/page.tsx このエラーが3回修正しても繰り返されています。
> 修正する前に、なぜ繰り返されるのか原因を分析してください:

TypeError: Cannot read properties of undefined (reading 'map')

根本原因が型定義ファイル・環境変数・依存関係にある場合、修正先を正確に特定できます。

修正が別のエラーを生む

一度にすべてを変更させず、段階的に修正させます。

> @src/lib/api.ts まず型定義だけを修正してください。
> ロジックの変更は次のステップで行います。

「型定義だけ」「エラーハンドリングだけ」のように範囲を絞ることで、副作用を最小化できます。


THINK YOU LAB での実際のフロー

THINK YOU LAB の LMS 開発では以下のフローでエラー修正を行っています:

  1. npx tsc --noEmit でエラー一覧を取得
  2. エラーを関連ファイルごとにグループ化
  3. @ファイル名 + エラー を Claude Code に渡す
  4. 修正後に git diff で変更内容を確認
  5. 問題なければコミット

このフローで TypeScript 型エラーの解消時間が大幅に短縮されています。


まとめ

エラーを Claude Code に渡す3ステップ:

  1. @ファイル名 でエラーが発生しているファイルを指定
  2. エラーメッセージ(スタックトレース全体)をそのままコピペ
  3. 「修正してから原因を説明して」と追記

| エラー種別 | 渡し方 | |---|---| | TypeScript 型エラー | tsc --noEmit の出力 + @ファイル名 | | ESLint エラー | eslint の出力 + @ファイル名 + @.eslintrc.json | | テスト失敗 | テスト出力 + @テストファイル + @ソースファイル(テスト変更禁止を明示) | | ランタイムエラー | スタックトレース全体 + @該当ファイル名 |

次のステップ:

  • Claude Code でファイルを読み書きさせる基本操作
  • Claude Code とは何か — 完全ガイド

「エラーを貼っても的外れな回答が来る」ときは、渡し方の問題です。実務で使える Claude Code エラー対処プロンプト集(コピペ即使用可)を LINE で無料配布中です。

→ Claude Code エラー対処プロンプト集を受け取る(LINE登録・無料)

note

Autoclaw Starter

Claude Code から n8n WFを自律生成・管理する実装スターター

noteで読む¥4,980

LINE 公式アカウント

Claude Code のエラー自動修正プロンプト集をLINEで無料配布中

R

Rikuto (LAB)

非エンジニアが Claude Code × n8n × Supabase で副業システムを作り続ける実験記。 失敗も含めたリアルな一次情報を発信しています。

THINK YOU LAB 運営

関連記事

  • AIエージェントが本番で失速する理由とメモリ設計の3つの罠

    2026-04-20

  • 55本のWFが1人で回り続ける構造とは何か — Agentic Flow Kit の全貌

    2026-04-18

  • Claude Code × n8n × autoclaw — 三位一体スタックの全体像と実装パターン

    2026-04-18

← ブログ一覧へ
X でシェアLINE でシェア
← 前の記事Claude Code でファイルを読み書きさせる基本操作 — 最初の10分で動かす
次の記事 →AI副業を始めて3ヶ月。時間とお金のリアルをぜんぶ書く

目次

  • Claude Code へのエラーの渡し方(基本)
  • エラーメッセージをそのままコピペして渡す
  • ファイルとエラーを一緒に渡す
  • 「修正してから原因を説明して」という指示パターン
  • エラー種別ごとの対処パターン
  • TypeScript 型エラー
  • ESLint エラー
  • テスト失敗(jest / vitest)
  • ランタイムエラー(スタックトレース)
  • ワンショットモードでの半自動化
  • 修正が上手くいかないときの対処
  • 同じエラーが繰り返される
  • 修正が別のエラーを生む
  • THINK YOU LAB での実際のフロー
  • まとめ
Think You Lab
このブログについて料金プランプライバシーポリシーお問い合わせ特定商取引法ログイン

© 2026 Think You Lab