VS Code, debug with live reload... possible?

Ionic Framework ionic-v3
1

When I manually started it with the “–livereload” argument, when I changed a line and saved it, the change was reflected on the device in seconds. Now that I started it with VS Code’s Debug menu, live reload does not work. Is that possible?

In the launch.json, I used something like this (generated by VS Code, modified by me slightly.

    {
        "name": "Run android on device",
        "type": "cordova",
        "request": "launch",
        "platform": "android",
        "target": "device",
        "sourceMaps": true,
        "cwd": "${workspaceRoot}"
    }
2

If you install the Cordova Tools extension for Visual studio, it will help you generate a working launch.json file for your VSCode to be able to debug your app with livereload.

Here is how it looks like for Running Android on a device:

    {
      "name": "Run Android on device",
      "type": "cordova",
      "request": "launch",
      "platform": "android",
      "target": "device",
      "port": 9222,
      "sourceMaps": true,
      "cwd": "${workspaceRoot}",
      "ionicLiveReload": true
    },

If you want to make it work with an iOS simulator or device, you’ll need to install the iOS Webkit Debug Proxy.

I struggled for so long to make this work that I did an entire article on my blog to make it simpler for others: https://geeklearning.io/live-debug-your-cordova-ionic-application-with-visual-studio-code/

Hope this helps!