Joshua's Docs - JavaScript Bundlers
Light

Resources

What & Link Type
Bundlers Tooling Report
- This is a great new resource (2020) for a comparison of common bundlers and build tools, especially based on supported feature sets.
Comparison / Analysis

Parcel

* --- WARNING!!! --- *
When you are on the docs pages for Parcel, make sure you are on the correct version (V1 vs V2)!

And make sure you have the version of Parcel you mean to have (parcel --version if you want to check).

Parcel Troubleshooting

  • I'm not getting source maps!

    • Things to make sure:

      • Don't use --no-source-maps
      • Don't use --experimental-scope-hoisting

Webpack

Webpack Resources

What & Link Type
Webpack Docs - "Getting Started" Guide
Flavio - "Introduction to Webpack" Guide
Andrew Welch - "An Annotated Webpack 4 Config for Frontend Web Development" Guide

Webpack Config File

If you want to use a config file with Webpack, you do so by making webpack.config.js in the root of your project, and having a single export:

module.exports = {
	// ...
};

For seeing all the options, and comments on what they do, reference the configuration page from the official docs.

You can use this interactive config builder tool, or this one, to help you get started.

Webpack Config File Intellisense / Autocomplete

If you are trying to get Intellisense to work in a webpack.config.js file, add a type annotation so VSCode can understand the config object:

/** @type {import('webpack').Configuration} */
module.exports = {
	mode: 'development',
	// ...
}

See my blog post on the topic, for details.

Webpack Troubleshooting

  • Issues building to a subdirectory, with relative URLs (for example, lots of ChunkLoadError messages, bundles not loading)

Rollup

Rollup Config File Intellisense / Autocomplete

If you are trying to get Intellisense to work in a rollup.config.js file, add a type annotation so VSCode can understand the config object:

/** @type {import('rollup').RollupOptions} */
const config = {
	//
};
export default config;
Markdown Source Last Updated:
Sat Jan 02 2021 23:38:10 GMT+0000 (Coordinated Universal Time)
Markdown Source Created:
Wed May 13 2020 21:55:42 GMT+0000 (Coordinated Universal Time)
© 2021 Joshua Tzucker, Built with Gatsby
Feedback