Vagrant + VSCode "read only" debug woes

For months I've noticed that several of my recent Visual Studio Code projects NodeJS projects were behaving weirdly during debugging. Whenever I stepped through a file after hitting a breakpoint, VSCode would open a new read-donly version of the file in a text editor window. It opened a new copy for every debug run, so after a long session of debugging I would have many files open. Worst of all, I couldn't fix a bug in the readonly file, so after figuring a solution out I had to fumble the through the mess of open documents to the writeable version.

I do almost all my projects in vagrant, where my VSCode run on my host PC, while my NodeJS runtime lives in a Linux VM. Code files live on the host filesystem, but are shared with the guest; editing happens on the host, execution on the guest.

Turns out the error is caused by VSCode not being able to map properly to the source files in Vagrant. You can put almost any value in the remoteRoot field, and if the dugger can't find it, it continues debugging using readonly copies. The solution is quite simple : in your VSCode launch.json, ensure that your remoteRoot is mapped to the absolute path of your project root, in your guest. This is mine

{
    "type": "node",
    "request": "attach",
    "name": "local",
    "port": 9222,
    "address": "localhost",
    "localRoot": "${workspaceFolder}/src",
    "remoteRoot": "/vagrant/src"
}

On the host, my project directory structure might look like the following c:/ └── myProject/ └── src/ └── index.js

The /myProject folder becomes /vagrant in my guest. And because of that, remoteRoot should be /vagrant/src, as this is where the root or entry file of my app is.