⚙️VSCodeでArduino開発をしよう⚙️

# はじめに🦀

Arduino IDEは2.0💫に進化して、内部でVSCodeが動くようになったおかげで、補完もショートカットも効いてとっても便利になりました。

でも………まだ物足りない！！！っていう人もいますよね？？？
僕は普段VSCode-Neovimを使って開発してるので、jkhlで移動できないとつらい気持ちになります。[^🐉]

そんなあなたのために！こちら！(後ほど導入します)

😎***VSCode Arduino***😎

https://marketplace.visualstudio.com/items?itemName=vscode-arduino.vscode-arduino-community

VSCode上でArduinoに書き込み、シリアル入出力など、Arduino IDEができることは大抵できちゃう超Coolなスグレモノです。

以前はMicrosoftが公式にサポートしていた拡張機能だったのですが、2024/10/1ほどにサポート終了のアナウンスがあったので、今回導入するのはコミュニティによるForkになります。
(↓のIssue参照)

https://github.com/microsoft/vscode-arduino/issues/1760

正式名称は"Arduino Community Edition"、でいいのかな……………？もともとのMicrosoftによる拡張機能の名称はArduinoでしたが、どちらも分かりにくいので以下、**VSCode Arduino**としましょう。

# 導入環境
OS: Windows 11
ボード: Arduino Uno R3

**(今回導入する)ツール:**
Visual Studio Code 1.96.0
Arduino IDE 2.3.4
Arduino CLI 1.1.1

**(今回導入する)拡張機能:**
Arduino Community Edition 0.7.2
C/C++ 1.23.2

# Arduino IDE、Arduino CLIのインストール
流石にみなさん、Arduino IDEは導入済みですよね……❓️
まだの方は↓からインストールしましょう。今回導入するのはArduino IDE 2.3.4です。

https://www.arduino.cc/en/software

> 「とっくに入ってるわ！！💥🔫」って方も、大丈夫です。
良い機会なので、最新版を使ってるか確認してみましょう……………(Arduino IDEのメニューバーのヘルプボタンからアップデートを確認できます。)

さて、Arduino CLIですが、聞いたことないよって方も多いかと思います。これは、Arduinoへの書き込みなどをコマンドライン上で行えるツールです。VSCode Arduinoはこれを使って動いているわけですね！

:::note
実はArduino-CLIのバイナリは、VSCode-Arduinoの拡張機能にバンドルされていて、別に個別にインストールしなくても動くようですが、なんとなく美学に反するのでここではローカルにも入れることにします……。[^🐈]
(ここでは拡張機能をローカルのArduino CLIを使うように設定します！)
:::

それではインストールしましょう。今回は現在の最新版であるArduino CLI 1.1.1を導入します。
↓にインストール方法とダウンロードリンクがあります。手順通りにすすめましょう💪

https://arduino.github.io/arduino-cli/1.1/installation/#download

下のコマンドを実行して返答が帰って来ればインストール成功です！🎉🎉🎉🎉🎉
```shell
arduino-cli version
```
```shell
arduino-cli  Version: 1.1.1 Commit: fa6eafcb Date: 2024-11-22T09:31:38Z
```

# VSCode Arduino、C/C++拡張機能のインストール
### VSCode Arduinoのインストール
それではいよいよ、まず👑***VSCode Arduino***👑をインストールしましょう！今回インストールするのは、現在最新版のArduino Community Edition 0.7.2です。
VSCodeの左の拡張機能パネルの検索欄に"Arduino"と入力して、Arduino Community Editionをインストールしましょう。
(前述の通り、Arduino Community EditionはMicrosoftによるサポートが終了してしまった"Arduino"という名前の拡張機能の、コミュニティによるFork Editionです。)

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1777479/5aac1bd1-1e1b-25d9-7cee-636a98878fc4.png)

下のリンクからもインストールできます。

https://marketplace.visualstudio.com/items?itemName=vscode-arduino.vscode-arduino-community

### C/C++拡張機能のインストール
次に、C/C++の拡張機能もインストールしましょう！ArduinoはC/C++ベースでプログラミングをするので、補完などLSPの機能を利用するのに必要です。

拡張機能パネルでC/C++と入力してインストールしましょう！今回はC/C++ 1.23.2をインストールします。

![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1777479/18993d2d-e0f7-a244-82d7-7adaf412ec41.png)

リンクも貼っておきます。

https://marketplace.visualstudio.com/items?itemName=ms-vscode.cpptools

# 拡張機能の設定
さて、いよいよ鬼門です。ここ最近の拡張機能やIDEの状況の変化でかなり環境が変わっているので、しっかり公式ドキュメントを読みながら進めましょう。

## VSCode Arduinoの設定
VSCodeでCtrl+,から設定を開き、"Arduino"と検索して拡張機能の設定を開きましょう。
変更するのは以下の4箇所です。

- Arduino: Use Arduino CLI
- Arduino: Path
- Arduino: Command Path
- Arduino: Disable Intelli Sense Auto Gen

各オプションの説明はVSCodeの設定画面に(英語ですが)書いてある他、下の記事でも解説されています🤲🤲🤲

https://zenn.dev/nyazuki/articles/2dcbeef58a0ee2#arduino-%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD-%E3%81%AE%E3%83%89%E3%82%AD%E3%83%A5%E3%83%A1%E3%83%B3%E3%83%88%E3%81%AE-options-%E3%81%AE%E6%97%A5%E6%9C%AC%E8%AA%9E%E8%A8%B3

ここでは今回設定するオプションと設定値の例について、それぞれ解説していきます。

#### Arduino: Use Arduino CLI
設定値: `true`
Arduino IDEの代わりにArduino CLIを使うかどうかの設定です。ドキュメントではArduino IDEの使用は非推奨なので大人しくチェックを入れておきましょう………🌊🏄

#### Arduino: Path
設定値: `C:\Program Files\Arduino CLI`

Arduinoのパスを指定します。説明には"Path to Arduino"と書いてありますが、Arduino CLIのディレクトリへのパスを指定してください！(多分)
インストール場所は人によって違う可能性があるので注意してください。Arduino CLIのインストール場所は下のコマンドで見れます。

```powershell:powershell
Get-Command arduino-cli
```

```shell:mac/linux
which arduino-cli
```

> 🧙‍♂️ < ずっとVSCodeからボードマネージャが開けなくて、なんだろうなんだろうと思っていたのですが、ここをArduino IDEのパスからArduino CLIのパスに変えたら動きました…………(体験談)

#### Arduino: Command Path
設定値: `arduino-cli.exe`

ここにはArduinoの実行ファイルのパスを指定します。説明には"Path to a script relative to 'arduino.path'"って書いてありますが、よく分からなかったのでArduino: Pathと同じようにarduino-cli.exeを指定したら動きました🤯

:::note
こことArduino: Pathを空白にすると拡張機能にバンドルされたarduino-cliが動作するそうです。[^🦈]
:::

#### Arduino: Disable Intelli Sense Auto Gen
設定値: `true`

Intelli Sense(=補完機能)によって自動的に作られるc_cpp_properties.jsonなどの設定ファイルを、自動的に作成されないようにします。
補完の履歴なんかが保存されるのかな…？よく分からないけれど、falseのままでもちゃんと動く気がします。

#### その他の設定
##### Arduino: Additional Urls
M5Stackなどで開発してて、サードパーティのボードマネージャが必要な人は、ここにそのurlを追加します。僕はArduino UNO R3なのでここは空っぽです。

#### settings.json
ここまでの内容をsettings.jsonに書くと、以下のようになります。

```json:settings.json
{
    "arduino.disableIntelliSenseAutoGen": true,
    "arduino.useArduinoCli": true,
    "arduino.commandPath": "arduino-cli.exe",
    "arduino.path": "C:\\Program Files\\Arduino CLI",
}
```

## 一旦動かしてみる🚂
おめでとうございます🎉🎉🎉🎉🎉
ここまで設定した勇者のみなさんは見事Arduino IDEの機能をVSCodeで使うことができます。

↓こんな画面
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/1777479/4a54a9f4-2899-1570-bc83-3796d7ee3d08.png)

試しにお手元のArduinoをUSBで接続して、VSCodeからCtrl+Shift+pで次のコマンドを実行していつもの機能を体験してみましょう！
(それぞれの機能は対応するGUIでも操作できます)

#### Arduino: Select Serial Port
シリアルポートを選択します。COM3を選びました。

#### Arduino: Board Manager
選択するとボードマネージャを選ぶ新しいタブが開きます。対応するボードマネージャを選びましょう。

#### Arduino: Open Serial Monitor
シリアルモニターを開きます。

#### Arduino: Verify
スケッチをコンパイルします。

#### Arduino: Upload
スケッチをArduinoに書き込みます❗️

## [Warning] Output path is not specified. Unable to reuse previously compiled files. の警告が出る場合⚠️

この状態でスケッチをコンパイルしてビルドすると、[Warning] Output path is not specified. Unable to reuse previously compiled files. という警告が出ることがあります。別に書き込みは問題なくできますが、気になる方はプロジェクトフォルダ内の`.vscode/arduino.json`に以下のように追記しましょう。

```diff_json:arduino.json
{
  "port": "COM4",
  "board": "arduino:avr:uno",
  "sketch": "SerialTest01.ino",
+ "output": "./build"
}
```
これで警告も消し去ることができます！
(これって新しいスケッチのたびに追記しなきゃいけないんですかね…？)

## C/C++拡張機能の設定
さて、VSCodeというエクスカリバーを手に大海原へ繰り出したみなさんが、Arduino開発をしていて最初に気づくことがあります。

「補完が効かない！！！😱」

元はといえば補完などのためにVSCodeを使い始めたのに、本末転倒ですね。
でも安心してください！C/C++の拡張機能を設定すれば無事に補完を使えるようになります！

C/C++拡張機能は以下の3点を設定します。

- C_Cpp.intelliSenseEngine
- C_Cpp.default.browse.path
- C_Cpp.default.includePath

それぞれ解説していきます。

#### C_Cpp.intelliSenseEngine
設定値: `Tag Parser`

Tag Parserに設定すると、なんだか曖昧なコンテクストで補完を提供してくれるらしいです。これを設定しないと謎の波線エラーが出ちゃうので設定しました。

##### 追記 (2025/02/02)
Tag Parserにすると確かにエラーが消えますが、曖昧動作のため本来表示してほしいエラーも全部消えてしまいます。残りの設定をデフォルトのIntelli Sense Engineでもエラーにならないように変更したので、**この設定は無しで大丈夫です。**


#### C_Cpp.default.browse.path
設定値: 
```
[
    "C:\Users\<username>\Documents\Arduino\libraries\**",
    "C:\Users\<username>\AppData\Local\Arduino15\libraries\**",
    "C:\Users\<username>\AppData\Local\Arduino15\packages\arduino\hardware\**",
    "C:\Users\<username>\AppData\Local\Arduino15\packages\arduino\tools\**"
]
```

ここにライブラリなどのパスを設定しておくとLSP (補完とか便利機能を提供してくれる*Intelligent*言語サーバのこと) がそれらをincludeして正しい補完を提供してくれます！
\<username\>のところは適宜書き換えてください。パスの意味は上から順番に↓です。

1. ユーザの入れたライブラリ
1. Arduino言語の使うライブラリ
1. ボードマネージャのプログラム？
1. ツール的な…？(謎🫠)

この辺のパスはArduino IDE 2になってから大幅に変わった部分です！Arduino IDEが追加する各種ディレクトリの説明は以下のリンクに書いてありますので、参考にしてください。

https://support.arduino.cc/hc/en-us/articles/4415103213714-Find-sketches-libraries-board-cores-and-other-files-on-your-computer

#### C_Cpp.default.includePath
設定値: 
```
[
    "C:\Users\<username>\Documents\Arduino\libraries\**",
    "C:\Users\<username>\AppData\Local\Arduino15\libraries\**",
    "C:\Users\<username>\AppData\Local\Arduino15\packages\arduino\hardware\**",
    "C:\Users\<username>\AppData\Local\Arduino15\packages\arduino\tools\**"
]
```

C_Cpp.default.browse.pathと同じように設定します。
ひょっとすると"includePath"と"browse.path"はどちらかでいいかもしれません。自分は最初includePathのみ設定していたところ、ちゃんと補完が表示されなかったので、browse.pathも設定するとちゃんと動きました。

#### C_Cpp.default.defines
(追記 2025/02/02)
設定値:
```
["USBCON"]
```
これを設定しないと、シリアル通信のSerialでエラーが出てしまいます…[^🐯]


#### settings.json
最終的なsettings.jsonは以下のようになりました。上のVSCode Arduinoの設定に併せて追記しておきましょう🎉🎉

```json:settings.json
{
  "C_Cpp.default.browse.path": [
    "C:\\Users\\<username>\\Documents\\Arduino\\libraries\\**",
    "C:\\Users\\<username>\\AppData\\Local\\Arduino15\\libraries\\**",
    "C:\\Users\\<username>\\AppData\\Local\\Arduino15\\packages\\arduino\\hardware\\**",
    "C:\\Users\\<username>\\AppData\\Local\\Arduino15\\packages\\arduino\\tools\\**"
  ],
  "C_Cpp.default.includePath": [
    "C:\\Users\\<username>\\Documents\\Arduino\\libraries\\**",
    "C:\\Users\\<username>\\AppData\\Local\\Arduino15\\libraries\\**",
    "C:\\Users\\<username>\\AppData\\Local\\Arduino15\\packages\\arduino\\hardware\\**",
    "C:\\Users\\<username>\\AppData\\Local\\Arduino15\\packages\\arduino\\tools\\**"
  ],
  "C_Cpp.default.defines": ["USBCON"]

}
```

# VSCodeでArduino開発の幕開け🌅
おめでとうございます！これにてセットアップは完了です🎉🎉🎉🎉
試しに.inoのスケッチを作って何か書いてみましょう！loopやprintlnの補完も効いて、ホバー機能も動作するはずです！

それではよきArduinoライフを❗️

[^🐉]: VSCodeならCopilotだって使えちゃうんですね………………………
[^🐈]: 他にもPrettierのVSCode拡張機能も、バンドルされたバイナリを持っていた気がします。ローカルにインストールしたやつを使うとパッケージ自体や設定を自分で管理できていいですよね🚂
[^🦈]: 下のリンクのarduino.useArduinoCLIオプションのdescriptionに記載アリ
https://marketplace.visualstudio.com/items?itemName=vscode-arduino.vscode-arduino-community
[^🐯]: 参考: https://github.com/microsoft/vscode-arduino/issues/808#issuecomment-490417186