Add client-side debugging instructions #28815
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
The current instructions on the Debugging page currently only work for server-side code, and furthermore, the page doesn't actually _say_ that they only work for server-side code. This update adds instructions for debugging client-side code in both VS Code and Chrome DevTools. It also improves the suggested VS Code launch configurations to take advantages of some relatively recent features in VS Code's [built-in JavaScript debugger][1]. Using the `node-terminal` and `pwa-chrome` launch types removes the need to manually pass an `--inspect` flag to the underlying Node.js process. [1]: https://github.com/microsoft/vscode-js-debug
TyMick
requested review from
huozhi,
ijjk,
leerob,
lfades,
padmaia,
shuding,
styfle and
timneutkens
as code owners
styfle
reviewed
Sep 8, 2021
styfle
reviewed
Sep 8, 2021
styfle
reviewed
Sep 8, 2021
styfle
reviewed
Sep 8, 2021
styfle
reviewed
Sep 8, 2021
styfle
reviewed
Sep 8, 2021
styfle
reviewed
Sep 8, 2021
styfle
reviewed
Sep 8, 2021
Co-authored-by: Steven <steven@ceriously.com>
So it'll work for everyone by default. vercel#28815 (comment)
|
Thanks for the helpful review, @styfle! |
bordeo
pushed a commit
to filoblu/next.js
that referenced
this pull request
Sep 16, 2021
* canary: (41 commits) Add client-side debugging instructions (vercel#28815) v11.1.3-canary.19 Update next-swc binaries (vercel#29132) Fix partial one off global selectors (vercel#29128) Update trace ignores for next import (vercel#29119) Development tracing improvements (vercel#29076) Remove log from failing to parse source map (vercel#29118) Remove inert font tag in font optimization (vercel#28869) v11.1.3-canary.18 Update Redux example to use Toolkit + update dependencies. (vercel#29104) Ensure browser instances are not re-created un-necessarily (vercel#29091) Update styled-jsx (vercel#29103) v11.1.3-canary.17 Add/styled jsx swc (vercel#29005) v11.1.3-canary.16 Fix host segment replacing for custom routes (vercel#29090) Add stats config for SWC (vercel#28883) reload the page to show 404 when receiving `invalid` event from on-demand-entries (vercel#29074) Add crossOrigin type to the NextConfig (vercel#29033) Fix/upload binary artifact (vercel#29069) ...
6 tasks
|
Is it possible to update the website (https://nextjs.org/docs/advanced-features/debugging) with the new documentation? |
|
It will be updated with the next release of Next.js 😄 |
Sign up for free
to subscribe to this conversation on GitHub.
Already have an account?
Sign in.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Fixes #16442
The instructions on the current Debugging page currently only work for server-side code, and furthermore, the page doesn't actually say that they only work for server-side code.
This update adds instructions for debugging client-side code in both VS Code and Chrome DevTools. It also improves the suggested VS Code launch configurations to take advantages of some relatively recent features in VS Code's built-in JavaScript debugger. Using the
node-terminalandpwa-chromelaunch types removes the need to manually pass an--inspectflag to the underlying Node.js process.Let me know if there are any edge cases I didn't consider with these VS Code launch configs!
Documentation / Examples