Debugging with VSCode

1. Install extensions

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

2. 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=/

Fixed observatory-port and disable auth-service in Dart VM

You can use the environment variables such as FLUTTER_ENGINE_SWITCHES, FLUTTER_ENGINE_SWITCH_* to use Dart VM command line options. If you want to fix always same observatory URI, you can use the following command. Note that this option is only available in debug mode.

$ export FLUTTER_ENGINE_SWITCHES=2
$ export FLUTTER_ENGINE_SWITCH_1="observatory-port=12345"
$ export FLUTTER_ENGINE_SWITCH_2="disable-service-auth-codes"

(snip)

flutter: Observatory listening on http://127.0.0.1:12345/

3. 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=/"
    }
  ]
}

4. Flutter attach debugger

Click Run and Debug