How to setup debugging in VSCode

Get Help and Help Others
1

Hi,
I tried to explore some options for debugging with redwood in VSCode but without success. Someone could give me a hint?

Thank you very much in advance,

Bests,

2

Hi @pnhoang! Thanks for checking in here. This isnā€™t quite what youā€™re looking for, but hereā€™s a brand new VS Code extension for Redwood that does offer some debugging features:
https://marketplace.visualstudio.com/items?itemName=decoupled.studio

2 Likes
3

Hi @thedavid,
Thanks for your response. Iā€™ll check it out.
Is there an option like redwood dev --inspect supported?

Bests,

4

HI @pnhoang - Iā€™ve had moderate success using the node.js debug terminal in vscode to run yarn rw dev.

image

You could also try setting up a launch.json file, I know the community would appreciate your contribution!

5

Not at this time, unfortunately. The closest we have is a CLI command for overall project structure inspection. This will tell you if youā€™re missing files, have incorrect Redwood syntax/conventions, etc.

yarn rw diagnostics

Other than that, as @danny mentioned most people rely on built in VS Code debug.

React/GraphQL/JS debugging is painful, isnā€™t it? Weā€™re hoping to increasingly make it less painful but recognize we arenā€™t there yet.

6

yarn rw dev runs two processes:

  1. webpack-dev-server
  2. redwoodā€™s API dev-server

You can run inspect by doing the following in your projectā€™s directory

cd api
yarn dev-server --inspect

I think we could definitely add this as an option that gets forwarded to the api-dev-server, Iā€™ve added an issue over here: Add option --inspect dev-server Ā· Issue #936 Ā· redwoodjs/redwood Ā· GitHub

7

You could also try setting up a launch.json

Hereā€™s what worked for me:

{
  "version": "0.2.0",
  "configurations": [
    {
      "type": "pwa-node",
      "request": "launch",
      "name": "Launch API",
      "skipFiles": [
        "<node_internals>/**"
      ],
      "cwd": "${workspaceFolder}/api",
      "envFile": "${workspaceFolder}/.env.defaults",
      "program": "${workspaceFolder}/node_modules/.bin/dev-server"
    }
  ]
}
2 Likes
8

I just created a pull-request adding a launch.json file

2 Likes