TeamsFx Hello World Tab示例应用如何调用本地开发?

How does TeamsFx Hello World Tab sample app invoke local development?

我使用 TeamsFx 工具包 VS 代码扩展创建了 hello world 选项卡示例。我不明白的部分是调用选项卡的调试模式如何反应应用程序启动脚本?

tasks.json文件中,有一个dependsOn teamsFx: frontend start设置。我不知道在哪里声明 frontend start 脚本或 frontend

这是 task.json 文件

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "Pre Debug Check",
      "dependsOn": ["dependency check", "prepare dev env"],
      "dependsOrder": "sequence"
    },
    {
      "label": "dependency check",
      "type": "shell",
      "command": "exit ${command:fx-extension.validate-dependencies}"
    },
    {
      "label": "prepare dev env",
      "dependsOn": ["prepare local environment", "frontend npm install"],
      "dependsOrder": "parallel"
    },
    {
      "label": "prepare local environment",
      "type": "shell",
      "command": "exit ${command:fx-extension.pre-debug-check}"
    },
    {
      "label": "Start Frontend",
      "dependsOn": ["teamsfx: frontend start"],
      "dependsOrder": "parallel"
    },
    {
      "label": "frontend npm install",
      "type": "shell",
      "command": "npm install --no-audit",
      "options": {
        "cwd": "${workspaceFolder}/tabs"
      }
    }
  ]
}

teamsfx: frontend start 是 Teams Toolkit 扩展使用 Visual Studio Code Extension API: Task Provider 贡献的任务。具体来说,来自 TeamsFx GitHub 回购:

  1. 此任务的定义在https://github.com/OfficeDev/TeamsFx/blob/ms-teams-vscode-extension%403.8.0/packages/vscode-extension/package.json#L717-L729
  2. 这个任务的实现在https://github.com/OfficeDev/TeamsFx/blob/ms-teams-vscode-extension%403.8.0/packages/vscode-extension/src/debug/teamsfxTaskProvider.ts#L116-L129