使用 VSCode + Arduino 延伸套模組開發 Arduino
Tags: arduino, vscode
Published: 2022-04-08 16:10:18

如果你無法擺脫 Arduino IDE, 卻又覺得 Arduino IDE 的編輯器太陽春, 可以試試看在 VSCode 中安裝微軟開發的 Arduino 延伸模組, 這可能會比轉移到 PlatformIO 簡單, 以下就來看看如何使用。

## 安裝 Arduino 延伸模組

安裝非常簡單, 只要到延伸模組搜尋 'arduino', 認明 Microsoft 開發的就可以了：

![](https://i.imgur.com/rwxHPEO.png)

## 設定 Arduinno 路徑

安裝完成後, 只要按下 <kbd>Ctrl</kbd>+<kbd>,</kbd> 開啟**設定**, 搜尋 "arduino: path"：

![](https://i.imgur.com/Iv4kZMO.png)

在欄位中鍵入你的 Arduino 所在路徑即可。

## 建立新專案

要建立新專案, 可依循以下步驟：

1. 建立新專案的空資料夾, 本例假設我們要寫一個閃爍 LED 的程式, 因此建立 blink 資料夾：

    ![](https://i.imgur.com/JeceMCU.png)

    ![](https://i.imgur.com/c5iduI2.png)

3. 將這個資料夾初始化成為 Arduino 的專案工作區, 請按 <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>p</kbd> 後輸入 "arduino", 執行 **Arduino: Initialize** 命令：

    ![](https://i.imgur.com/SuEIHm0.png)

    它會說在資料夾下找不到草稿 (sketch) 檔, 因為我們剛剛建立的是空的資料夾, 請鍵入和資料夾一樣名稱、但附檔名為 .ino 的檔名：

    ![](https://i.imgur.com/ZHeGU1C.png)

1. 初始完成時, 它可能會問你要不要安裝 C++ 的延伸模組, 由於 Arduino 採用的程式語言就是 C++, 因此建議你安裝：

    ![](https://i.imgur.com/ZVduW9g.png)

1. 它會幫你自動產生含有 Arduino 程式基本框架的程式檔：

    ![](https://i.imgur.com/rPjPDUk.png)


1. 你就可以開始撰寫程式, 不過你會發現它好像不認識 Arduino 的關鍵字, 到處都是紅色波浪的未定義警告：
  
    ![](https://i.imgur.com/Qll2OhA.png)


## 設定開發板

這是因為 Arduino 延伸模組還不知道要採用哪一個開發板, 所以沒有相關的資訊, 因此除了標準的 C++ 以外, 並不認得像是 `pinMode` 等等這些由你的開發板套件提供的函式。接著, 就讓我們來設定要使用哪一個開發板：

1. 按一下下方的 **<Slect Board Type>** 鈕：
  
    ![](https://i.imgur.com/Spz3kWr.png)

    你可以在上方的欄位輸入板子型號搜尋, 像我現在使用的是 LOLIN D32 這一塊 ESP32 開發板。
    
1. 它會開始驗證 (Verify) 目前的程式, 你可以在輸出區看到目前的進度：
  
    ![](https://i.imgur.com/jhhdEys.png)

    驗證的過程中它也會建立 intellisence 資料, 也就是等下你鍵入程式時, 它會適時提供你可選用的候選字、函式的參數提示與說明等等。

    如果你看到下訊息：
    
    ![](https://i.imgur.com/hRUDQC3.png)

    表示建置 intellisense 資料的程序發生錯誤, 最有可能的情況是**你的 .ino 檔名和資料夾的名稱不一樣**, 請修正後執行
  
    ![](https://i.imgur.com/MASdzom.png)

1. 當你看到輸出區出現以下訊息時, 就表示已經完成初次選用開發板的程序：
  
    ![](https://i.imgur.com/MikCnVz.png)

    你會發現編輯區原本紅色波浪現已經都消失了, 表示現在 Arduino 延伸模組已經認得 `pinMode` 等這些由開發板套件提供的函式了。
    
1. 現在你再鍵入程式時, 就會看到 intellisnse 功能出現了：
  
    ![](https://i.imgur.com/oY9frXQ.png)

    是不是很讚！

## 設定建置 (build) 檔的資料夾

在實際上傳程式之前, 有一個專案專屬的設定要先完成, 就是**建置 (build)** 過程的檔案要放到哪一個資料夾下：
  
1. 開啟左側檔案總管下 .vscode 下的 arduino.json 檔：
  
    ![](https://i.imgur.com/BMqt1Bs.png)

1. 在 **output** 項目填入資料夾名稱, 建議就填入 "build", 稍後在上傳程式前編譯連結過程產生的檔案就會放在專案資料夾下指定名稱的這個資料夾中。
  
有了這個設定, 就可以重複利用目前編譯連結的成果, 不用每次都要重新編譯連結所有的檔案, 節省時間。
  
## 上傳程式

接著就可以上傳程式了：
  
1. 按右下方的 **<Select Serial Port>** 選取序列埠：

    ![](https://i.imgur.com/EVowODt.png)

1. 你可以按右上方的上傳鈕或是按 <kbd>Ctrl</kbd>+<kbd>Alt</kbd>+<kbd>U</kbd>上傳程式：
  
    ![](https://i.imgur.com/D3cwIJg.png)

    上傳過程會在輸出區顯示, 最後上傳成功就可以看到板子上的 LED 閃爍了。
  
## 開啟既有的專案

對於既有的專案, 就跟剛剛的流程一樣, 先開啟專案所在的資料夾, 在初始化後就可以改用 VSCode 繼續開發。

## 安裝程式庫
  
如果你要安裝的程式庫是在 Aruino 的程式庫管理員中, 就可以在 VSCode 中依照以下步驟安裝：
  
1. 按 <kbd>Ctrl</kbd>+<kbd>Shift</kbd>+<kbd>p</kbd> 執行 **Arduino: Library Manager**：
  
    ![](https://i.imgur.com/M1lEwMq.png)

1. 在出現的 **Arduino Library Manager** 窗格中就可以搜尋所需要的程式庫後安裝：
  
    ![](https://i.imgur.com/UKb19iN.png)

如果你是下載 ZIP 程式庫檔, 可以回頭使用 Arduino IDE 匯入程式庫。
  
## 使用序列埠監控視窗

在 VSCode 中也可以開啟序列埠監控視窗：
  
1. 執行 **Arduino: Open Serial Monitor** 指令：
  
    ![](https://i.imgur.com/NcOwVN8.png)

1. 即可看到下方出現序列埠監控視窗：
  
    ![](https://i.imgur.com/86EyDtt.png)

## 開發板管理員
  
如果要安裝既有的開發板套件不同的版本, 可以執行 **Arduino: Board Manager** 指令：
  
![](https://i.imgur.com/Tez3uOu.png)

右下角的 **Additional URLs** 連結可以加入額外的套件網址：

![](https://i.imgur.com/9iESKVU.png)

或是你也可以回到 Arduino IDE 使用**開發板管理員**。
  
## 小結

微軟的 Arduino 延伸套件基本上就是透過 VSCode 操控 Arduino IDE, 對於無法放棄 Arduino IDE 的人來說, 是很不錯的替代開發環境。