Quick Start Guide
rollup --help to see the available options and parameters. The starter project templates, rollup-starter-lib and rollup-starter-app, demonstrate common configuration options, and more detailed instructions are available throughout the user guide.
These commands assume the entry point to your application is named main.js, and that you'd like all imports compiled into a single file named bundle.js.
# compile to a <script> containing a self-executing function$ rollup main.js --format iife --name "myBundle" --file bundle.js
# compile to a CommonJS module$ rollup main.js --format cjs --file bundle.js
For both browsers and Node.js:
# UMD format requires a bundle name$ rollup main.js --format umd --name "myBundle" --file bundle.js
In addition to enabling the use of ES6 modules, Rollup also statically analyzes the code you are importing, and will exclude anything that isn't actually used. This allows you to build on top of existing tools and modules without adding extra dependencies or bloating the size of your project.
For example, with CommonJS, the entire tool or library must be imported.
// import the entire utils object with CommonJSvar utils = ;var query = 'Rollup';// use the ajax method of the utils objectutils;
But with ES6 modules, instead of importing the whole
utils object, we can just import the one
ajax function we need:
// import the ajax function with an ES6 import statement;var query = 'Rollup';// call the ajax function;
Because Rollup includes the bare minimum, it results in lighter, faster, and less complicated libraries and applications. Since this approach is based on explicit
export statements, it is vastly more effective than simply running an automated minifier to detect unused variables in the compiled output code.
Rollup can import existing CommonJS modules through a plugin.
Publishing ES6 Modules
To make sure your ES6 modules are immediately usable by tools that work with CommonJS such as Node.js and webpack, you can use Rollup to compile to UMD or CommonJS format, and then point to that compiled version with the
main property in your
package.json file. If your
package.json file also has a
module field, ES6-aware tools like Rollup and webpack 2 will import the ES6 module version directly.
- step-by-step tutorial video series, with accompanying written walkthrough
- miscellaneous issues in the wiki
This project exists thanks to all the people who contribute. [Contribute].
Thank you to all our backers! 🙏 [Become a backer]
Support this project by becoming a sponsor. Your logo will show up here with a link to your website. [Become a sponsor]