ビルド＆デプロイエラー

TypeScript CIの失敗、ビルドエラー、デプロイの失敗の修正方法。

ビルドエラーとは？

ビルドエラーは、pnpm devでは問題なく動くアプリが、pnpm buildを実行するときやPRでCIが実行されるときに失敗する場合に発生します。これはVibe coderにとって最もよくある問題です。

なぜ？pnpm devは寛容で、高速なフィードバックのために多くのチェックをスキップするからです。しかしpnpm buildはTypeScriptをストリクトモードで実行し、明示的な型注釈が必要です。

最もよくあるエラー：暗黙の'any'型

圧倒的に最も頻度の高いビルドエラーです。以下のように表示されます：

./app/dashboard/page.tsx:24:30
Type error: Parameter 'item' implicitly has an 'any' type.

  22 |   const data = await fetchData();
  23 |   
> 24 |   const names = data.map((item) => item.name);
     |                              ^^^^
  25 |

修正はシンプルです — 型注釈を追加します：

// BAD - CIで失敗する
const names = data.map((item) => item.name);

// GOOD - 明示的な型注釈
const names = data.map((item: typeof data[0]) => item.name);

ビルド出力の読み方

ビルド出力は何が間違っているか正確に教えてくれます：

./app/dashboard/page.tsx:24:30    <-- ファイルと行番号
Type error: Parameter 'item'     <-- 何が間違っているか
  implicitly has an 'any' type.  <-- なぜ間違っているか

> 24 |   data.map((item) => ...    <-- 該当の行

重要な情報：

1. ファイルパス — どのファイルにエラーがあるか
2. 行番号 — どの行を見るべきか
3. エラーメッセージ — 何を変更する必要があるか

コミット前に必ずビルドを実行

Vibe coderにとって最も重要な習慣です：

# モノレポのルートから
pnpm build:your-app-name

# パスすれば、コミットもCIをパスします
# 失敗したら、コミット前にエラーを修正してください

PRでのCIチェックの失敗

PRを作成すると、CIが自動的にビルドを実行します。失敗した場合：

1. PRはマージできません
2. チェックの横に赤い「X」が表示されます
3. 「Details」をクリックしてエラー出力を確認

Railwayでのデプロイ失敗

ローカルでビルドは成功するが、Railwayでデプロイが失敗する場合があります。よくある原因：

• 環境変数の欠落 — Railwayダッシュボードで設定する
• 異なるNode.jsバージョン — Railwayが異なるバージョンを使用している可能性
• 依存関係の欠落 — パッケージがpackage.jsonにない

クイズ