开发者工具宿主接入

背景

开发者工具扩展提供宿主在开发者工具内的最小集、端能力的实现，小程序开发者在开发者工具内的宿主环境调试时，是必须要宿主方实现的功能。

常用路径

vendor 文件夹地址

开发者工具的资源目录，不同系统和工具版本不一致，具体规则如下：

• windows（%USERPROFILE% 是你的用户目录）
  • 正式版本：%USERPROFILE%\AppData\Roaming\百度开发者工具\cli\vendor
  • rc 版本： %USERPROFILE%\AppData\Roaming\百度开发者工具-rc\cli\vendor
• mac
  • 正式版本：~/Library/Application Support/百度开发者工具/cli/vendor
  • rc 版本：~/Library/Application Support/百度开发者工具-rc/cli/vendor

日志文件地址

• windows（%USERPROFILE% 是你的用户目录）
  • 正式版本：%USERPROFILE%\AppData\Roaming\百度开发者工具\log.log
  • rc 版本：%USERPROFILE%\AppData\Roaming\百度开发者工具-rc\log.log
• mac
  • 正式版本：~/Library/Logs/百度开发者工具/log.log
  • rc 版本：~/Library/Logs/百度开发者工具-rc/log.log

命令行启动命令

对于 rc 版本，需要在目录和可执行文件的名字 开发者工具/swan-ide-gui 后面，添加 -rc

• windows
  • 快捷方式：在后面添加 --host --console 参数来启动工具 【推荐】
  • cmd：${安装目录}\百度开发者工具.exe --host --console
    完整命令类似 %USERPROFILE%\AppData\Local\Programs\swan-ide-gui\百度开发者工具.exe --host --console
• mac
  • ${安装目录}/百度开发者工具.app/Contents/MacOS/百度开发者工具 --host --console
    完整命令类似 /Applications/百度开发者工具.app/Contents/MacOS/百度开发者工具 --host --console

快速开始

要实现一个新的 API，需要在开发者工具模拟器扩展中添加一个 API 的实现，同时在框架的 extensionJs 中添加一个新的 API 描述。下面简述如何快速添加一个 API

• 安装 2.2.4 以上版本的开发者工具
• 下载 demo 示例
• 到 vendor 文件夹下，创建 demo-program-extension 目录，并复制 demo 内的 extensionJs/1.0.0 到目录中。
  复制后的目录结构如下：

└── vendor
        └── demo-program-extension
                    └──  1.0.0
                           ├──  extension.js
                           └──  extension.css

• 通过上面提供的命令行方式打开开发者工具 【一定要通过命令行加参数打开】
• 打开一个小程序工程，在工具栏中打开宿主配置管理中心，选择加载本地宿主，打开 demo/ide/demo 目录，关闭宿主配置管理中心，切换成示例 App 宿主
• 等待编译完成后，在调试器 console 中输入 swan.demo.demo({data:{test: 1}，success:console.log}) ，可以看到输出了 API 中返回的内容。

ps：如果开发其他本地宿主，将目录和配置中的 demo 替换成你自己的宿主名。

接入流程图