Flutter 开发 vscode断点调试

        众所周知,在前端开发过程中,我们可以通过断点的形式进行调试,方便定位数据问题,跟踪代码执行,在FLutter中其实也是可以的,笔者用的是vscode进行开发,下面针对web开发模式进行说明:

1、安装Flutter插件,这个是vscode中必要的步骤,不再过多说明,在扩展中搜索“flutter”,第一个就是

2、安装后,在右边栏多处一个图标,就是flutter插件(备注:会自动安装dart插件,无需手动安装),点击该图标,显示如下:

3、根据自己的模式进行选择模式,我是web调试,所以点击“Dart  & Flutter”, 选择如下:

4、然后在需要断点的行,在代码中把断言点亮

5、点击启动图标即可,当代码运行到该行代码的时候,会跟web开发调试一样中断并定位到该代码,方便调试。

6、打开调试,执行代码

web窗口:

代码窗口:

就可以跟web一样进行调试定位问题了,这可比print方便多了,也更强大~

  • 6
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
对于在VSCode中进行Flutter开发调试,您可以按照以下步骤操作: 1. 首先,确保您已经安装了Flutter SDK并设置了相关环境变量。您可以通过运行`flutter doctor`命令来验证安装是否成功。 2. 打开VSCode,并在插件市场中安装Flutter和Dart插件。这些插件为您提供了在VSCode中进行Flutter开发所需的工具和功能。 3. 创建一个新的Flutter项目,您可以在终端或通过命令面板执行`Flutter: New Project`命令来完成。接着,选择一个目录来存储项目文件,并输入项目名称。 4. 在VSCode中打开您的Flutter项目文件夹。在首次打开项目时,VSCode会自动检测到您的项目并提供相应的建议和工具。 5. 使用VSCode调试功能来设置和执行调试会话。点击左侧的调试图标(或按下`Ctrl+Shift+D`),然后选择一个调试配置。如果您尚未创建调试配置文件,则可以选择"创建一个launch.json文件"。选择"Flutter"作为调试环境。 6. 配置调试器选项,例如指定要调试的设备、入口文件等。这些选项可以通过编辑launch.json文件来完成。 7. 在VSCode中打开您想要调试的Dart文件,并在需要断点的位置添加断点。您可以通过单击行号来添加/移除断点。 8. 启动调试会话,方法是点击调试工具栏中的"启动调试"按钮(或按下`F5`),然后选择适当的调试配置。调试会话将在模拟器/真机上启动,并在程序遇到断点时停止。 9. 调试会话启动后,您可以使用常用的调试功能,例如单步执行、查看变量值、观察表达式等。 10. 在调试过程中,您还可以使用VSCode提供的其他功能,例如代码补全、代码导航等,以提高开发效率。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值