Package Exports
- bundle-wizard
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (bundle-wizard) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
🧙♂️ bundle-wizard
This command line utility makes it simple to create visualizations of the JS bundles that were fetched for any specific page (or "entry point") of a web app.
Quick start
Simply run the command npx bundle-wizard to get started.
Example
npx bundle-wizard reddit.com
Check out a live demo of this visualization
Fun
Try any of the following commands to take a peek at the JavaScript code different sites are shipping:
npx bundle-wizard reddit.comnpx bundle-wizard pinterest.comnpx bundle-wizard codesandbox.ionpx bundle-wizard gatsbyjs.orgnpx bundle-wizard codecademy.comnpx bundle-wizard id.atlassian.com
Optional command line arguments
url (initial argument)
To skip the initial prompt, provide a url as a first argument:
npx bundle-wizard reddit.com
desktop flag
By default, bundle-wizard will analyze a mobile version of the site. To analyze the desktop version instead, pass the --desktop flag:
npx bundle-wizard --desktop
debug flag
If you'd like to see more logging and detailed error messages, add this flag.
npx bundle-wizard --debug
ignoreHTTPSErrors flag
If you are running an HTTPS connection on localhost and want to test a local site, you'll need to use this setting to prevent self-signed certificate errors:
npx bundle-wizard https://localhost:5000 --ignoreHTTPSErrors
Credits
The core functionality of this library is provided by the awesome source-map-explorer.
Requirements
Downloadable sourcemaps
This utility downloads sourcemaps from the url you provide. This requires the sourcemaps to be publically available, or at least available on your network. You might need to point to a testing instead of production build, for instance, as some apps disable sourcemaps in production.
A local Chrome installation
The wizard uses
puppeteer-coreto load coverage information from the provided url. This requires you to have a fairly up-to-date version of Chrome installed on your machine.