Windows上で Claude Code + ESP-IDF による開発（M5Stack Tab5活用例）

結論

WindowsでClaude Codeを使ってESP-IDF開発したい場合の個人的おすすめ環境↓

• WSL環境にClaude Codeをインストール・実行
• PowerShell環境でESP-IDF環境を整える。
• WSL環境でClaude Codeを使いながら、PowerShell環境でビルド・フラッシュする。

対象読者

• 最近Claude Code始めたけど、ESP-IDFでどうやって開発するんだ？となっている方

背景

最近Claude Code始めました。
定性的な評価ではありますが、エッジ系の開発をする際は他のコーディング支援ツールと比較して精度高く生成してくれます。
しかし、Claude CodeはWindows(PowerShell)では使用できません※。
インストールしようとすると怒られます。
※2025/06/08現在情報

npm install -g @anthropic-ai/claude-code
npm error code 1
npm error path C:\Users\{ユーザ名}\AppData\Local\nvm\v22.14.0\node_modules\@anthropic-ai\claude-code
npm error command failed
npm error command C:\WINDOWS\system32\cmd.exe /d /s /c node scripts/preinstall.js
npm error Error: Claude Code is not supported on Windows.

かといってWSL上でESP-IDF環境を構築すると、USB周りで追加の設定が発生するので、デバッグが面倒そうです。
そこで、今回はWindows環境でESP-IDF環境を構築し、WSL環境でClaude Code環境を構築したらいい感じだったので紹介します。

方法

WSL環境上にClaude Codeのインストール

公式ドキュメント通りインストールします。
私はProプランに課金したので、それでログインしました。

Windows環境上にESP-IDF環境をインストール

公式ドキュメント通りインストールします。
ちなみに、VS Codeの拡張機能ESP-IDF Extension for VSCodeを使っても↑と同じようにインストールされるので、楽です。
以後はVS Codeの拡張機能を使って開発する前提でお話します。
私の環境では以下のディレクトリにインストールされました。

C:\Users\{ユーザ名}\esp\v5.4.1\esp-idf\export.ps1

ESP-IDF環境の初期設定

VS Codeの拡張機能を使って、プロジェクトを作成します。
使用するマイコンなどを選択します。
今回は説明のため、以下の既存のデモアプリをフォークしてきました。
https://github.com/m5stack/M5Tab5-UserDemo

コーディング

VS Codeとは別ウィンドウでWSLを開きます。
VS Code内のTerminalで開いても良いのですが、操作性を鑑み、別ウィンドウで開きました。
WSLのウィンドウで指示出し、VS Codeのウィンドウでdiffを確認したり、idf.pyコマンドでビルドやフラッシュします。

以下のような感じになります。

あとはお好きにコーディングしてください！

おすすめ設定

以下をClaude Codeに指示出ししておくと開発効率が上がったので、共有します。

ビルドの指示

Claude Codeに以下の指示を入れると、コード編集が終わったら勝手にビルドまで確認してくれるので、とても楽でした。
（Tokenの消費は激しそうですが。。。）

ビルド指示プロンプト

C:\Users\{ユーザ名}\esp\v5.4.1\esp-idf\export.ps1 してcd .\platforms\tab5\してidf.py buildでビルドできるので、コード編集終わったら実行して

以下のように勝手に直してくれます。

Claude Codeがビルドまで確認してくれる様子

> C:\Users\{ユーザ名}\esp\v5.4.1\esp-idf\export.ps1 してcd .\platforms\tab5\してidf.py buildでビルドできるので、コード編集終わったら実行して

● Bash(cd /mnt/c/Users/{ユーザ名}/workspace/private/m5stack/M5Tab5-DrawingCameraApp/platforms/tab5 && idf.py build)
  ⎿  Error: (eval):1: command not found: idf.py

● ESP-IDFの環境設定が必要です。PowerShellでの手順に従います：

● Bash(powershell.exe -Command "& { C:\Users\{ユーザ名}\esp\v5.4.1\esp-idf\export.ps1; cd .\platforms\tab5\; idf.py build }")
  ⎿  Done! You can now compile ESP-IDF projects.
     Go to the project directory and run:

       idf.py build
     … +61 lines (ctrl+r to expand)

● ビルドエラーが発生しました。問題はlv_indev_t*ポインターをログ出力で使用していることです。フォーマット指定子を修正します：

● Update(app/apps/app_drawing_camera/app_drawing_camera.cpp)
  ⎿  Updated app/apps/app_drawing_camera/app_drawing_camera.cpp with 1 addition and 1 removal
     276                  _touch_points[touch_id].last_x = canvas_x;
     277                  _touch_points[touch_id].last_y = canvas_y;
     278                  drawOnCanvas(canvas_x, canvas_y);
     279                  mclog::tagInfo(getAppInfo().name, "Touch started: device %p, slot %d at (%d,%d)", indev, touch_id, canvas_x, canvas_y);
     279                  mclog::tagInfo(getAppInfo().name, "Touch started: device {}, slot {} at ({},{})", (void*)indev, touch_id, canvas_x, canvas_y);
     280              }
     281          } else if (event_code == LV_EVENT_PRESSING) {
     282              int touch_id = findTouchPointSlot(indev);

LVGLバージョンの明示

CLAUDE.mdにLVGLのバージョンを明示した方がよいです。
フォークしてきたプロジェクトはLVGL v9.2.0を使っていたのですが、最初に生成されたコードは古い関数を拾ってきたことがあり、ビルドエラーが頻発していました。
きちんとV9であることを明示したら治りました。

成果物

https://github.com/zakuzakuzaki/M5Tab5-DrawingCameraApp
https://x.com/zakuzaku_3/status/1931579157403615623

おわりに

esp32の開発はシェア率的にはArduino環境が強いと思いますが、Claude Code使っていけばESP-IDF環境でもやっていけそうな気がしました！