使用 VS Code 快速開發 ESP32

• 使用 VS Code 快速開發 ESP32
• 搭建開發環境
• 在 VS Code 中進行開發
• VS Code 任務、快捷鍵配置
• 任務配置
• 快捷鍵配置

使用 VS Code 快速開發 ESP32

搭建開發環境

• 根據官方文件進行 esp-idf 開發環境搭建
• 安裝 VS Code

在 VS Code 中進行開發

• 將 esp-idf 中的模板工程 hello_world 在 VS Code 中開啟
• 在 VS Code 中開發專案

VS Code 任務、快捷鍵配置

任務配置

• 按下 Ctrl+Shift+P
• 輸入、選擇 Tasks: Configure Task(任務：配置任務)
• 使用模板建立 tasks.json 檔案
• 選擇 others
• 可使用下面的的任務配置模板（實現：快捷編譯、下載、擦除 flash、清除編譯、開啟 monitor、menuconfig）

{
    // See https://go.microsoft.com/fwlink/?LinkId=733558
    // for the documentation about the tasks.json format
    "version": "2.0.0",
    "tasks": [
        {
            "label": "build app", // f5
            "type": "shell",
            "command": "cd ${fileDirname} && cd ../ && make -j8",
            "group": {
                "kind": "build",
                "isDefault": true
            }
        },
        {
            "label": "flash app", // f6
            "type": "shell",
            "command": "cd ${fileDirname} && cd ../ && make -j8 flash"
        },
        {
            "label": "monitor", // f7
            "type": "shell",
            "command": "cd ${fileDirname} && cd ../ && make monitor"
        },
        {
            "label": "clean app", // f8
            "type": "shell",
            "command": "cd ${fileDirname} && cd ../ && make clean",
        },
        {
            "label": "erase flash", // f9
            "type": "shell",
            "command": "cd ${fileDirname} && cd ../ && make erase_flash",
        },
        {
            "label": "menuconfig", // f10
            "type": "shell",
            "command": "cd ${fileDirname} && cd ../ && make menuconfig"
        },
    ]
}
 

詳細配置過程：

快捷鍵配置

接下來我們給這些編譯命令增加快捷鍵。

• 按下：Ctrl+Shift+P
• 輸入、選擇 Preferences: Open Keyboard Shortcuts(JSON) (首選項:開啟鍵盤快捷方式)
• 高階自定義請開啟和編輯 keybindings.json
• 填充引數

// Override key bindings by placing them into your key bindings file.
[
    {
        "key": "f5",
        "command": "workbench.action.tasks.runTask",
        "args": "build app"
    },
    {
        "key": "f6",
        "command": "workbench.action.tasks.runTask",
        "args": "flash app"
    },
    {
        "key": "f7",
        "command": "workbench.action.tasks.runTask",
        "args": "monitor"
    },
    {
        "key": "f8",
        "command": "workbench.action.tasks.runTask",
        "args": "clean app"
    },
    {
        "key": "f9",
        "command": "workbench.action.tasks.runTask",
        "args": "erase flash"
    },
    {
        "key": "f10",
        "command": "workbench.action.tasks.runTask",
        "args": "menuconfig"
    }
]
 

這樣我們就可通過快捷鍵進行編譯、下載等

NOTE: 這些命令都應該在工程的 main 目錄下的檔案中執行，例如： 在 VS Code 中打開了 hello_world 工程中 main 目錄下的 hello_world_main.c 檔案，可以按快捷鍵 F6 進行編譯、下載。暫不支援在其他目錄下進行。

詳細配置過程：