Setup Visual Studio Code Ruby on Rails debugger with webpack-dev-server autolaunch

a_vscode_ror_debugger_setup_with_webpack_dev_server_autolaunch.md

Visual Studio Code Ruby on Rails debugger with webpack-dev-server autolaunch

1. Both files needs to be specified for every workspace
2. Install gem ruby-debug-ide gem install ruby-debug-ide
3. If using rvm make sure to have correctly setup paths or open workspace from terminal with code .
4. With rbenv everything should work out of the box
5. You can now run rails server with pressing button (or ctrl+shift+d) and webpack-dev-server will start automatically on background.

Notes: Please note, when you stop debug server, webpack-dev-server remain running in terminal (because it's background job). Without promlemMatcher specified in tasks.json, solution not working. ( more here https://stackoverflow.com/a/54017304/3442759 )

launch.json

{
  "version": "0.2.0",
  "configurations": [
    {
      "name": "Rails server",
      "type": "Ruby",
      "request": "launch",
      "program": "${workspaceRoot}/bin/rails",
      "args": [
        "server"
      ],
      "preLaunchTask": "webpack-dev-server",
      "postDebugTask": "postdebugKill"
    }
  ]
}

tasks.json

{
  "version": "2.0.0",
  "tasks": [
    {
      "label": "webpack-dev-server",
      "type": "shell",
      "isBackground": true,
      "command": "./bin/webpack-dev-server",
      "problemMatcher": [
        {
          "pattern": [
            {
              "regexp": ".",
              "file": 1,
              "location": 2,
              "message": 3
            }
          ],
          "background": {
            "activeOnStart": true,
            "beginsPattern": ".",
            "endsPattern": ".",
          }
        }
      ]
    },
    {
      "label": "postdebugKill",
      "type": "process",
      "command": [
        "${command:workbench.action.tasks.terminate}",
        "${command:workbench.action.acceptSelectedQuickOpenItem}",
      ],
    }
  ]
}