使用VSCode调试RN项目

时间:2024-03-26 08:25:07

1.安装VSCode

安装就不说了,之前用的是Webstorm,换成VSCode的一个原因是Webstorm太吃内存且收费,还有一个非常最重要原因:免费啊,对于码农的我们,这就是刚需。

2.插件安装:

a.点击左侧的扩展按钮,进入扩展搜索界面,搜索debugger for chrome插件,安装,刷新:
  使用VSCode调试RN项目
 b.点击左侧的调试按钮选择“添加配置”,如下图:
 使用VSCode调试RN项目
 c.然后会打开lanch.json配置文件,如下图:选择“React Native: Attach to packager”选项
 使用VSCode调试RN项目
d.接下来先运行Attach to packager:
使用VSCode调试RN项目
e.然后开启模拟器Debug JS Remotely模式,一切完成之后你就可以console.log(‘控制台输出数据’)或进行断点调试,断点仅仅在debug模式下有用:
使用VSCode调试RN项目

3.最后看到这样的效果,就可以使用VSCode愉快调试RN了:

使用VSCode调试RN项目