# Microbundle — Zero-Configuration Bundler for Tiny JavaScript Modules

> A zero-configuration bundler for small JavaScript and TypeScript libraries. Microbundle produces modern ESM, CJS, and UMD outputs from a single source with automatic minification.

## Install

Save as a script file and run:

# Microbundle — Zero-Configuration Bundler for Tiny JavaScript Modules

## Quick Use
```bash
npm install -D microbundle
```
```json
{
  "source": "src/index.ts",
  "main": "dist/index.cjs",
  "module": "dist/index.mjs",
  "scripts": { "build": "microbundle" }
}
```
```bash
npm run build
```

## Introduction
Microbundle is a zero-configuration bundler purpose-built for authoring JavaScript and TypeScript libraries. It reads your `package.json` fields to determine output formats, automatically handles TypeScript, JSX, and modern syntax, and produces optimized CJS, ESM, and UMD bundles in one command.

## What Microbundle Does
- Builds libraries into ESM, CJS, and UMD formats from a single source
- Reads `main`, `module`, and `exports` fields from `package.json` to determine outputs
- Handles TypeScript and JSX without additional configuration
- Minifies output with Terser and generates source maps
- Generates TypeScript declaration files automatically

## Architecture Overview
Microbundle wraps Rollup with a set of carefully chosen defaults. It reads your `package.json` to determine entry points and output targets, configures Rollup plugins for Babel transpilation, TypeScript compilation, and Terser minification, then runs the Rollup build. The result is multiple output bundles optimized for different module systems, all from a single invocation with no config file required.

## Self-Hosting & Configuration
- Install as a dev dependency: `npm install -D microbundle`
- Set `source` in `package.json` to your entry point (e.g., `src/index.ts`)
- Set `main` (CJS), `module` (ESM), and optionally `unpkg` (UMD) output paths
- Run `microbundle` or `microbundle watch` for development
- Override defaults via CLI flags: `--target node` for Node-only builds, `--css inline` for CSS handling

## Key Features
- Truly zero-config: reads everything from `package.json`
- Multi-format output (ESM, CJS, UMD) in one build
- Built-in TypeScript support with declaration file generation
- CSS Modules support out of the box
- Watch mode with fast incremental rebuilds

## Comparison with Similar Tools
- **tsup** — Similar zero-config bundler using esbuild; faster builds but fewer output format options
- **Rollup** — The engine under Microbundle; requires manual configuration for plugins and outputs
- **esbuild** — Extremely fast bundler; needs manual config for multi-format library output
- **Vite (library mode)** — Rollup-based with HMR for apps; Microbundle is library-focused and simpler

## FAQ
**Q: Does Microbundle support React components?**
A: Yes. Microbundle handles JSX out of the box. Use `--jsx React.createElement` or the automatic JSX runtime with `--jsxImportSource react`.

**Q: Can I customize the Babel or Rollup configuration?**
A: Microbundle intentionally limits configuration. For advanced needs, you can use CLI flags like `--external`, `--globals`, and `--alias`. For full control, consider using Rollup or tsup directly.

**Q: How small are the output bundles?**
A: Microbundle applies Terser minification and tree-shaking by default. Output size depends on your source code, but the tool adds minimal overhead.

**Q: Does Microbundle support CSS?**
A: Yes. It handles CSS Modules and plain CSS imports, optionally inlining styles or extracting them to separate files.

## Sources
- [GitHub Repository](https://github.com/developit/microbundle)
- [npm Package](https://www.npmjs.com/package/microbundle)

---
Source: https://tokrepo.com/en/workflows/asset-fbd7629d
Author: Script Depot