VSCode调试脚本
- 本功能建立在Node.js的调试基础之上,安装Node.js是必要条件。
- 无需依赖AP插件依旧能调试,我们只是对动态编译文件路径,源映射等繁琐配置进行了适配,旨在减轻创作者的手动配置负担。
- 尽管已支持原生JavaScript的调试,但遗憾的是,
目前暂不支持对神岛API进行调试
。 完整编译
与HMR编译
是两种不同的编译模式,它们对调试过程会产生不同的影响。推荐采用HMR编译
模式,具体优势及使用方法请阅读编译并调试文件。
关于vscode调试功能介绍:逐断点、逐过程、单步调试与单步跳出
捆绑js文件调试
配置lunch.json
- 初次调试,先创建launch.json文件。(已创建可略过本步骤)
- 选择调试的配置,这里有3种类型。
- Arena Debugger : 【引擎待对接,目前不支持】远程调试神岛编辑器,并返回数据。
- ArenaPro Client Debugger : 本地调试客户端的捆绑js文件。
- ArenaPro Server Debugger : 本地调试服务端的捆绑js文件。
- 选择后将自动配置
- 同时可以使用右下角的配置按钮进行新增配置
编译并调试文件
在调试之前,你需要编译ts文件。推荐使用HMR编译
模式。
因为这种模式下,调试器会自动监听文件变化并自动编译。 可以边修改ts
文件边调试_xxx_bundle.js
文件,并且可以在入口文件开始的任意ts
文件里断点调试。
反之,使用完整编译
模式,则需要每次手动编译。并且只能在编译后的js
文件上进行断点调试。
这里推荐暂时把编译脚本后上传到神岛编辑器功能关闭,适合本地调试用。
这里推荐开启debugger模式,这样打包后的捆绑文件不会压缩和混淆,方便查看运行时变量等数据。
这里以HMR编译
为例,开启HMR服务器后,你就可以在入口文件开始的任意ts
文件里面断点,然后按下F5
进行调试。
单个js文件调试
为了满足对快速调试单个js脚本而非整个项目的需求,推荐使用单个JS文件的调试功能。只需在任意的.js
、.mjs
或.cjs
文件中设置断点,随后运行该文件进行调试。
在编辑器的右上角,找到快速Debugger
按钮,点击即可。
快捷键:Alt+D
注:默认非捆绑文件的.js
全部解析为ECMAScript
模块。