rsnext/contributing/core/vscode-debugger.md
Balázs Orbán 3ff21ed178
refactor: split up CONTRIBUTING.md (#40515)
Continues #39778

Closes #40499

## Bug

- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Errors have helpful link attached, see `contributing.md`

## Feature

- [ ] Implements an existing feature request or RFC. Make sure the
feature request has been accepted for implementation before opening a
PR.
- [ ] Related issues linked using `fixes #number`
- [ ] Integration tests added
- [ ] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
- [ ] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [ ] Make sure the linting passes by running `pnpm lint`
- [ ] The examples guidelines are followed from [our contributing
doc](https://github.com/vercel/next.js/blob/canary/contributing.md#adding-examples)

Co-authored-by: Tim Neutkens <tim@timneutkens.nl>
Co-authored-by: JJ Kasper <jj@jjsweb.site>
2022-09-16 14:54:58 -07:00

1.5 KiB

Using the VS Code Debugger

Debug configurations

The Next.js monorepo provides configurations in the .vscode/launch.json file to help you debug Next.js from VS Code.

The common configurations are:

  • Launch app development: Run next dev with an attached debugger
  • Launch app build: Run next build with an attached debugger
  • Launch app production: Run next start with an attached debugger

Run a specific app

Any Next.js app inside the monorepo can be debugged with these configurations. For example to run "Launch app development" against examples/hello-world:

  1. Open the .vscode/launch.json file.
  2. Find the configuration "Launch app development".
  3. Edit the runtimeArgs array's last item to be "examples/hello-world".
  4. Save the file.
  5. Now you can start the debugger and it will run against the examples/hello-world app!

To see the changes you make to the Next.js codebase during development, you can run pnpm dev in the root directory, which will watch for file changes in packages/next and recompile the Next.js source code on any file saves.

Breakpoints

When developing/debugging Next.js, you can set breakpoints anywhere in the packages/next source code that will stop the debugger at certain locations so you can examine the behavior. Read more about breakpoints in the VS Code documentation.