image

JavaScript module bundlers

Tools that bundle your modern JavaScript applications

Internally they build dependency graphs which map every modules your projects need and generate one or module bundles.


Webpack

image

webpack.js.org

Webpack is the most popular and powerful module bundler for JavaScript when they can process any kind of files and they can output packages, websites, or servers. They have been well developed with flexible architecture including highly customizable configurations, extensive plugins and loaders ecosystem.

Rollup

image

rollupjs.org

Rollup is another module bundler that can output both library and application, has default support to ES Modules and famous for tree shaking from early days. Rollup also has plugin system to customize its behavior like transpiling code before bundling or finding third-party modules in our node_modules folder.

Parcel

image

parceljs.org

Parcel focuses solely on bundling web application with zero-configuration. It has out of the box support for JS, CSS, HTML, file assets with no plugins needed. While many bundlers require you to install and configure plugins to transform assets, Parcel is a plug-and-play tool which can automatically transform JavaScript using Babel, CSS using PostCSS, HTML using PostHTML, and ven node_modules when needed.

Browserify

image

browserify.org

Browserify is a tool for bundling Node packages for the browser, happens to work for browser-based apps pretending to be Node packages. The module system that browserify uses is the same as node, so packages published to npm that were originally intended for use in node but not browsers will work just fine in the browser too.