Skip to content

Debugging with VSCode

Hidenori Matsubayashi edited this page Sep 30, 2023 · 17 revisions

Install extensions

Install the VS Code extension to Flutter: https://marketplace.visualstudio.com/items?itemName=Dart-Code.flutter

Prepare launch.json

<path_to_flutter_project>/.vscode/launch.json can be created by flutter-elinux tool automatically. So, you can basically skip the following steps.

Getting the Observatory port

You will find the following message in the console when you run Flutter apps. You need to attach a debugger to this port when you want to debug it. Note that the URI changes every time after launching.

flutter: Observatory listening on http://127.0.0.1:43377/390I4oPyQ0U=/

Use fixed observatory URI

If you want to fix always same observatory URI, you can use the following command options. Note that this option is only available in debug/profile mode.

$ flutter-elinux run -d elinux-wayland --disable-service-auth-codes\
    --device-vmservice-port=12345 --host-vmservice-port=42771

(snip)

An Observatory debugger and profiler on eLinux is available at: http://127.0.0.1:42771/

Create launch.json

Create a launch.json file like the following.

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "dart",
      "name": "Flutter eLinux desktop Attach",
      "request": "attach",
      "deviceId": "flutter-tester",
      "observatoryUri": "http://127.0.0.1:43377/390I4oPyQ0U=/"
    }
  ]
}

Flutter attach debugger

Click Run and Debug Screenshot from 2021-07-30 16-57-33