Debugging React app started with yarn

已回答

创建于 2024年06月21日 19:04

I'm working on an app that uses yarn to start it. Typically, I run yarn dev to start it. In the package.json file, dev is defined:

"dev": "yarn cross-env NODE_ENV=development node src/server.js",

I can't figure out how to create a Debug configuration that connects to the app and lets me set breakpoints in IntelliJ. I'm not a frontend developer, and I'm unclear about what information I need. Another team member has configured VSCode for debugging like this:

 {
     "name": "Launch AppXX",
     "request": "launch",
     "type": "chrome",
     "url": "https://appxx:443",
     "webRoot": "${workspaceFolder}/app",
     "sourceMaps": true
   }

What would be the equivalent IntelliJ debug configuration configuration?

2 条评论

Elena Pogorelova

创建于 2024年06月25日 14:14

Did you try the steps in https://www.jetbrains.com/help/idea/react.html#react_running_and_debugging_debug? Start the application by running yarn dev (can be done either in terminal or with NPM run configuration, using the gutter icons), and, once the application is up and running, select the JavaScript Debug run configuration with https://appxx:443 set as URL and press Debug.

If this doesn't work for you, could you please share a screencast of the problem with us? This will help us to understand what it looks like on your side.

Aaron

创建于 2024年07月11日 21:45

I re-read those instructions and got it working. For reference, this is how I run the react app:

“yarn dev”

where

"dev": "yarn cross-env NODE_ENV=development node src/server.js",

And this simple configuration connects the debugger:

It was a tricky, because we use nginx and therefore a different URL with a different port when manually connecting to the app with a browser.

请先登录再写评论。