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>
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
:
- Open the
.vscode/launch.json
file. - Find the configuration "Launch app development".
- Edit the
runtimeArgs
array's last item to be"examples/hello-world"
. - Save the file.
- 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.