微信小程序测试的环境搭建,整体流程是:
1.安装微信开发者工具
2.登录微信开发者工具
3.安装hbuildx
4.导入项目
5.设置hbuildx和微信开发者关联信息
6.编译代码
7.微信小程序测试
1、安装微信开发者工具
1.微信开发者工具下载
打开网站:https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html
选择windows系统版本
2.下载完成后按步骤进行安装
略
2、登录微信开发者工具
1.进行扫码登录
2.点击确认登录
3.安装HbuildX
1.下载地址:https://www.dcloud.io/hbuilderx.html
2.选择app开发版本
3.解压安装包
解压后找到HBuilderX.exe双击运行。如图:
4.双击HBuilderX.exe文件
4.导入项目
1.打开目录选择项目文件夹
5.设置hbuildx和微信开发者关联信息
1.加载微信开发者工具,选择工具-设置
2.然后在运行配置里面设置微信开发者工具的路径,如下图所示:
3.接着登录微信开发者工具,点击设置下面的安全设置:
服务端口设置为开启
4.运行->运行到小程序模拟器(M)->启动微信开发者工具
6.编译代码
1.安装node.js
2.安装项目依赖包
路径:项目所在目录
命令:npm –registry https://registry.npm.taobao.org install
3.控制台点击右键,选择重新运行或停止运行。
4.微信开发者工具,加载小程序成功
7.微信小程序测试
1.清理缓存
2.刷新
3.查看接口日志
跟浏览器的F12功能相似,可以查看接口访问信息,用于定位问题。
8.遇到的问题
问题1:Cannot find module ‘node-ipc’
报错信息:
20:20:52.201 module.js:549
20:20:52.201 throw err;
20:20:52.204 ^
20:20:52.204 Error: Cannot find module ‘node-ipc’
20:20:52.207 at Function.Module._resolveFilename (module.js:547:15)
20:20:52.208 at Function.Module._load (module.js:474:25)
20:20:52.211 at Module.require (module.js:596:17)
20:20:52.211 at require (internal/module.js:11:18)
20:20:52.213 at Object. (D:\ProgramFiles\HBuilderX\plugins\uniapp-cli\node_modules@vue\cli-shared-utils\lib\ipc.js:1:75)
20:20:52.214 at Module._compile (module.js:652:30)
20:20:52.217 at Object.Module._extensions…js (module.js:663:10)
20:20:52.217 at Module.load (module.js:565:32)
20:20:52.221 at tryModuleLoad (module.js:505:12)
20:20:52.221 at Function.Module._load (module.js:497:3)
解决方案:
工具菜单-> 插件安装 -> uni-app编译
找到这个插件后把它卸载然后重新安装就OK了
问题2:文件查找失败:‘luch-request’ at api\request.js:3
15:08:52.069 Browserslist: caniuse-lite is outdated. Please run:
15:08:52.069 npx browserslist@latest –update-db
15:08:57.711 Browserslist: caniuse-lite is outdated. Please run the following command:
npm update
15:08:59.526 文件查找失败:‘luch-request’ at api\request.js:3
15:08:59.527 ERROR Build failed with errors.
解决方案:
1.安装依赖包:
npm –registry https://registry.npm.taobao.org install
问题3:安全接口未关起
10:56:09.346 正在启动微信开发者工具…
10:56:09.751 [微信小程序开发者工具] – initialize
10:56:09.751 [微信小程序开发者工具]
10:56:09.754 [微信小程序开发者工具]
10:56:09.766 [微信小程序开发者工具] [error] IDE service port disabled. To use CLI Call, please enter y to confirm enabling CLI capability, or manually open IDE -> Settings -> Security Settings, and set Service Port On.
10:56:09.766 [微信小程序开发者工具] For more details see: https://developers.weixin.qq.com/miniprogram/en/dev/devtools/cli.html
10:56:09.769 [微信小程序开发者工具] [error] 工具的服务端口已关闭。要使用命令行调用工具,请在下方输入 y 以确认开启,或手动打开工具 -> 设置 -> 安全设置,将服务端口开启。
10:56:09.773 [微信小程序开发者工具] 详细信息: https://developers.weixin.qq.com/miniprogram/dev/devtools/cli.html
10:56:09.773 [微信小程序开发者工具]
10:56:09.776 [微信小程序开发者工具] ? Enable IDE Service (y/N) [27D[27C
10:56:09.780 [微信小程序开发者工具] × initialize
10:56:09.780 [微信小程序开发者工具]
10:56:09.783 [微信小程序开发者工具] Runtime error
10:56:09.783 [微信小程序开发者工具] Error: read EBADF
10:56:09.787 [微信小程序开发者工具] at Pipe.onStreamRead (internal/stream_base_commons.js:183:27) {
10:56:09.791 [微信小程序开发者工具] errno: ‘EBADF’,
10:56:09.796 [微信小程序开发者工具] code: ‘EBADF’,
10:56:09.800 [微信小程序开发者工具] syscall: ‘read’
10:56:09.804 [微信小程序开发者工具] }
解决方案:
打开工具 -> 设置 -> 安全设置,将服务端口开启
问题4:小程序定位问题
可以在调试器中编辑自己需要设置的经纬度
问题5:点击“预览”生成二维码时报错
解决方案:运行中勾选“运行时是否压缩代码”