Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Document Cross-Platform VS Code Debugging #30052

Merged
merged 7 commits into from
Oct 28, 2021
10 changes: 10 additions & 0 deletions docs/advanced-features/debugging.md
Original file line number Diff line number Diff line change
Expand Up @@ -84,6 +84,16 @@ Once the server starts, open a new tab in Chrome and visit `chrome://inspect`, w

Debugging server-side code here works much like debugging client-side code with Chrome DevTools, except that when you search for files here with <kbd>Ctrl</kbd>+<kbd>P</kbd> or <kbd>⌘</kbd>+<kbd>P</kbd>, your source files will have paths starting with `webpack://{application-name}/./` (where `{application-name}` will be replaced with the name of your application according to your `package.json` file).

### Debugging on Windows

Windows users may run into an issue when using `NODE_OPTIONS='--inspect'` as that syntax is not supported on Windows platforms. To get around this, install the [`cross-env`](https://www.npmjs.com/package/cross-env) package as a development dependency (`--dev` with Yarn or `-D` for NPM) and replace the `dev` script with the following.

```json
"dev": "cross-env NODE_OPTIONS='--inspect' next dev",
```

`cross-env` will set the `NODE_OPTIONS` environment variable regardless of which platform you are on (including Mac, Linux, and Windows) and allow you to debug consistently across devices and operating systems.

## More information

To learn more about how to use a JavaScript debugger, take a look at the following documentation:
Expand Down