Blackboxing Scripts in Chrome DevTools

There are two ways you can add scripts to the blackbox blacklist:

1. Using the Settings panel: Right-clicking on any script in the Sources panel Settings panel
2. Use the Settings panel to configure blackboxed scripts: Open the DevTools Settings and click on the “Blackboxing” tab.

• ^https:\/\/, basically block any CDN-hosted libraries (greedy, but I’d prefer to be implicit)
• plugins, I like to put all locally hosted and manually installed libraries/plugins in this directory (when not using a package manager to manage dependencies)
• \.min\.js$, for all minified sources
• node_modules and bower_components, for package manager dependencies
• ~, home, for dependencies in a Webpack bundle
• bundle.js, it’s a bundle itself (we use sourcemaps, don’t we?)
• (webpack)-hot-middleware — “Hot Module Replacement”, (HMR) is a feature to inject updated modules into the active runtime.