No more debugging detours: Chrome DevTools ignore node_modules by default
Stay focused on your own code
I’m Jecelyn Yeen, currently working on Chrome Tooling - Chrome DevTools, Puppeteer and more at Google. I tend to talk about web development, debugging & testing.
Prefer video over text? Head to the end for the video version.
Hooray! No more unwanted detours into the depths of node_modules during debugging. Stay focused on your code and boost your productivity!
Imagine this: You're debugging a React application and set a breakpoint to catch a button click event. With the new ignore node_modules by default feature, DevTools will instantly jump to your code, bypassing the code from all third-party libraries.
Without this feature: You might be surprised to land in the React code (or library code) first, you have to press a few more clicks to navigate to your own files. Talk about a time-waster!
Stay in control: With the new setting, you can still customize the ignore list anytime in the settings or by right-clicking on specific files and folders to ignore/unignore them.
Further exploration: Want to learn more about the ignore list settings and tweak them to your liking? Check out this link for detailed information: goo.gle/ignore-list.
Hi Jecelyn,
just spended a good amount of time wondering why my debugger; statement did not trigger in a vue component I was writing (changes updated via HMR). Any chance to avoid those false positive matches?