Microbundle

The zero-configuration bundler for tiny modules, powered by Rollup.

---

Guide →
Setup ✯
Formats ✯
Modern Mode ✯
Usage & Configuration ✯
All Options

---

✨ Features

- One dependency to bundle your library using only a package.json
- Support for ESnext & async/await _(via [Babel] & [async-to-promises])_
- Produces tiny, optimized code for all inputs
- Supports multiple entry modules _(cli.js + index.js, etc)_
- Creates multiple output formats for each entry _(CJS, UMD & ESM)_
- 0 configuration TypeScript support
- Built-in Terser compression & gzipped bundle size tracking

🔧 Installation & Setup

1️⃣ Install by running: npm i -D @kne/microbundle

2️⃣ Set up your package.json:

``jsonc
{
"name": "foo", // your package name
"type": "module",
"source": "src/foo.js", // your source code
"exports": {
"require": "./dist/foo.cjs", // used for require() in Node 12+
"default": "./dist/foo.modern.js" // where to generate the modern bundle (see below)
},
"main": "./dist/foo.cjs", // where to generate the CommonJS bundle
"module": "./dist/foo.module.js", // where to generate the ESM bundle
"unpkg": "./dist/foo.umd.js", // where to generate the UMD bundle (also aliased as "umd:main")
"scripts": {
"build": "microbundle", // compiles "source" to "main"/"module"/"unpkg"
"dev": "microbundle watch" // re-build when source files change
}
}
`

3️⃣ Try it out by running npm run build.

💽 Output Formats

Microbundle produces esm, cjs, umd bundles with your code compiled to syntax that works pretty much everywhere.
While it's possible to customize the browser or Node versions you wish to support using a browserslist configuration, the default setting is optimal and strongly recommended.

🤖 Modern Mode

In addition to the above formats, Microbundle also outputs a modern bundle specially designed to work in _all modern browsers_.
This bundle preserves most modern JS features when compiling your code, but ensures the result runs in 95% of web browsers without needing to be transpiled.
Specifically, it uses Babel's "bugfixes" mode
(previously known as preset-modules) to target the set of browsers that support