HBuilderX 连接 微信开发者工具

一、打开微信开发者工具

第一次连接至微信开发者工具之前，需要先启动微信开发者工具，在工具栏，依次点击 设置 -> 安全设置，在弹出的设置弹窗中，安全选项下，开启服务端口。如下图所示。

 

 

二、HBuilderX 配置

①. 打开HBuilderX，在工具栏，依次点击 运行 -> 运行到小程序模拟器 -> 运行设置，配置微信开发者工具路径。

 

 ②. 再次点击 运行 -> 运行到小程序模拟器，点击 微信开发者工具 模拟器即可。

 

 ③. 启动成功，自动打开微信开发者工具。

 

 ④. 微信开发者工具编译页面

 

 

 

三、运行到页面

从 HBuilderX 中连接至微信开发者工具，如果想要直接运行到某一个页面，可在项目中编辑启动页配置。

在 pages.json 文件中，新增启动页面即可。效果同在微信开发者工具中，添加编译模式。

    "condition" : { //模式配置，仅开发期间生效
        "current": 0, //当前激活的模式(list 的索引项)
        "list": [
            {
                "name": "index", //模式名称
                "path": "pages/index/index", //启动页面，必选
                "query": "" //启动参数，在页面的onLoad函数里面得到
            }
        ]
    }

四、能打开微信开发者工具，但运行不了项目的情况

打开项目中 manifest.json 文件，找到微信小程序配置，查看微信小程序 AppID 是否自己没有权限。如果是测试项目，申请一个测试 AppID 填写就行。