Awesome Rollup
⚡️ Delightful Rollup Plugins, Packages, and Resources
Resources
- Official Guide - The user guide and documentation site.
Plugins
Core Plugins
Plugins created and maintained by the Rollup organization.
- alias - Alias modules in a build.
- babel - Seamless integration with Babel.
- buble – Transpile with Bublé.
- commonjs - Convert CommonJS modules to ES Modules.
- dsv - Convert CSV and TSV files into JavaScript modules.
- eslint - Lint entry points and all imported files with ESLint.
- html - Creates HTML files to serve Rollup bundles
- image - Import JPG, PNG, GIF and SVG images.
- inject - Scans for global variables and injects
import
statements. - json - Convert JSON files to ES Modules.
- legacy - Add export statements to plain scripts.
- multi-entry - Multiple entry points for a bundle.
- node-resolve - Use the Node resolution algorithm.
- replace – Replace occurrences of a set of strings.
- run - Run your bundle after it's generated.
- strip - Remove expressions from code.
- sucrase - Compile , Flow, JSX.
- typescript - Seamless integration with Typescript.
- url - Inline import files as data-URIs.
- virtual - Load modules from memory.
- wasm - Inlines and imports WebAssembly modules.
- yaml - Import data from YAML files.
All-Purpose Awesome
- build-statistics - Plugin that keeps a continuous log of your build time.
- dev - Development server with additional logging and options.
- graph – Generates a module dependency graph.
- nollup - Rollup-compatible development bundler providing Hot Module Replacement.
- notify – Display errors as system notifications.
- progress - Show build progress in the console.
- rollpkg - No config build tool to create packages with Rollup and TypeScript
- serve - Development Server in a Plugin.
- sizes - Display bundle content and size in the console.
- size-snapshot - Track bundle size and treeshakability with ease.
- visualizer - Bundle and dependency visualizer.
Code Quality
Plugins which help with code quality.
- analyzer - Statistics and Metrics for a bundle.
- cleanup – Remove and modify code based on an opinionated ruleset.
- eslint-bundle - Lint bundles with ESLint.
- flow - Remove Flow type annotations.
- flow-entry - Export Flow types from a bundle.
- istanbul - Seamless integration with Istanbul.
- sass-lint - Lint SCSS files
- stylint - Lint Stylus files.
- unassert - Remove assertion calls.
CSS
Plugins for working with CSS.
- bundle-scss - Bundle all SCSS imports into one SCSS file.
- collect-sass - Compiler SASS files in a single context.
- css-only – Output plain CSS.
- css-porter - Combine CSS imports and output to file.
- embed-css - Import and append CSS to a bundle.
- less - Compile LESS files.
- less-modules - Import or Bundle LESS files.
- modular-css - Alternative CSS Modules implementation supporting Rollup.
- postcss - Seamless integration with PostCSS.
- sass - SASS integration for a bundle.
- scss - Compile SASS and CSS.
- styles - Universal plugin for styles: PostCSS, Sass, Less, Stylus and more.
- stylus-css-modules – Compile Stylus and inject CSS modules
- sass-variables - Import SASS variables as Objects.
Frameworks
Plugins for working with awesome JavaScript frameworks.
- angular - Angular2 template and styles inliner.
- jsx - Compile React JSX and JSX-like components.
- riot - Riot.js tagfile support.
- svelte — Compile Svelte components.
- vue - Compile Vue components.
- vue-inline-svg - Import SVG files as Vue components.
Modules
Plugins which control the behaviour of modules: dependencies, imports, exports, and external modules.
- amd - Convert AMD modules to ES6.
- async-define - Wrap an AMD bundle with async-define.
- baked-env - Import
process.env
as a module for baking environment variables at build time. - bower-resolve – Use Bower the resolution algorithm.
- cjs-es - Convert CommonJS modules without proxying and reassignment.
- consts - Import constants at build time.
- external-assets - Make assets external but include them in the output.
- external-globals - Replace imported bindings with a global variable.
- force-binding - Composes multi-entry and node-resolve to prevent duplicated imports.
- glob-import - Glob support for import statements.
- hoist-import-deps - Avoid waterfalls when dynamically importing modules by hoisting import dependencies.
- ignore - Ignore modules by replacing with empty objects.
- import-alias - Maps an import path to another.
- import-assertions - Add support for TC39 import assertions (e.g. assert types
css
andjson
) - includepaths – Provide base paths from which to resolve imports.
- named-directory - Provides shortcuts for colocated modules in directories.
- node-builtins - Node builtin modules as ES modules.
- node-globals - Injects node globals.
- node-resolve-angular - Node module resolution support for Angular 4+.
- ts-paths – Resolve modules from
tsconfig
paths. - skypack-resolver - Use Skypack CDN for external dependencies.
- web-worker-loader - Package Workers for NodeJS and the browser.
Other File Imports
Plugins which allow importing other types of files as modules.
- file-as-blob – Import a file as a
blob:
URL. - geojson - Convert GeoJSON files to ES Modules.
- glsl - Import GLSL shaders as compressed strings.
- glsl-optimize - Import and optimize GLSL shaders as compressed strings. Supports glslify.
- glslify - Import GLSL strings with glslify.
- gltf - Import glTF 3d models as a URI or inlined JSON.
- html - Import html files as strings.
- hypothetical - Import modules from a virtual filesystem.
- imagemin - Optimize images with imagemin.
- jsonlines - Imports .jsonl (JSON Lines) files as JSON arrays.
- markdown - Import code from fenced code blocks in Markdown.
- md - Import and compile markdown files.
- mjml - Convert MJML into responsive email templates.
- @wasm-tool/rust - Bundle and import Rust crates.
- rust - Compile Rust as WebAssembly or a Node.js Add-on.
- spritesmith — Convert a set of images into a spritesmith sprite-sheet.
- string – Import text files as strings.
- svg-import - Import SVG files as SVG DOM Node or string.
- svg-sprite — Import SVG files as an external SVG sprite.
- svg-to-symbol - Import SVG files as symbol strings.
- svgo - Import SVG files as strings
- vinyl - Import from Vinyl files
- smart-asset - Import any assets as url using rebase, copy or inline mode. Similar to
url
but has more hashing options and works well together with babel using transform hook. - toml - Convert .toml files to ES6 modules.
Output
Plugins which affect the final output of a bundle.
- app-utils - Common build utilities for applications.
- banner - Append content before js bundle.
- bundleutils - Set of commonly used utility functions.
- bundle-html - Inject the bundle js/css files as well as external js/css files to html template.
- by-output - Apply plugins according to special output option, reduce config and save time.
- clear - Clear an output directory before a build.
- closure-compiler – Compress Rollup Bundles with Closure Compiler.
- concatfiles - Concatenate files to bundle or other files.
- copy - Copy files during a build.
- copy-assets - Copy specified assets to the output directory.
- cpy - Easily copy files and folders during a build.
- copy-smartly - Smartly copy files if they are changed, created or deleted.
- delete - Delete files and folders during a build.
- emit-ejs - Emit files from ejs templates.
- espruino - Send a bundle to Espruino devices.
- filesize - Display the file size of the bundle in the console.
- generate-html-template - Generate an HTML file for a bundle.
- generate-package-json - Generate a
package.json
file with dependencies from your bundle. - gzip - Create a compressed GZ artifact for your bundle.
- hash – Generate output files with unique hashes.
- html-minifier – Minify HTML output files using html-minifier.
- iife - Convert ES modules to Immediately Invoked Function Expressions.
- license - Add Licensing to a bundle.
- live-reload - Live reloading for a bundle.
- manifest-json - Generate a
manifest.json
file for a PWA. - output-manifest - Generating a chunk manifest.
- preserve-shebang - Preserves leading shebang in a build entry.
- prettier - Run prettier on a bundle.
- rebase - Copies and adjusts asset references to new destination-relative location.
- shift-header - Move comment headers to the top of a bundle.
- sri - Add subresource integrity attributes for your bundle.
- static-site - Generate HTML for a bundle.
- terser - Minify a bundle using Terser.
- uglify - Minify a bundle with UglifyJS.
- version-injector - Inject your package’s version number into static build files.
- zip - Pack all assets into a zip file.
Templating
Plugins for working with template languages.
- twig - Import pre-compiled Twig.js templates.
- dustjs - Import Dust.js templates.
- eft - Compile ef.js templates.
- ejs - Compile .EJS templates.
- jst - Compile Lodash templates.
- lit-html - Compile "plain" .html files as
lit-html
templates - posthtml-template - Seamless integration with PostHTML
- pug - Compile Pug Templates as es6 modules.
- pug-html - Import Pug Templates as HTML strings during a build.
- reshape - Compile Reshape Templates.
Text Replacement
Plugins which search for, and replace text in a bundle.
- ascii – Rewrite non-ASCII characters as string literals.
- re – Replace text with Regular Expressions.
- strip-code - Remove text with Regular Expressions.
Transpilation
Plugins which affect code.
- async - Replace
async
functions with generators. - bucklescript - Compile ReasonML / OCaml.
- coffee-react - Compile CJSX and CoffeeScript.
- coffee-script – Compile CoffeeScript.
- dts - Rollup
.d.ts
TypeScript Definition files. - elm - Compile Elm.
- esbuild-transform - Transform with esbuild.
- flat-dts -
.d.ts
files flattener. - jspicl - Transpile JavaScript into PICO-8 Lua.
- nodent - Transpile ES2017
async
/await
. - pegjs - Import PEG.js grammars as parsers.
- purs - Compile PureScript.
- regenerator - Replace
async
functions with ES5 Promise functions. - ts - Transpile with Babel, TypeScript, or both, while respecting Browserslist and TypeScript declarations.
- typescript2 - Compile TypeScript v2.0+.
Workflow
Plugins which affect the Rollup workflow.
- browsersync – Serves a bundle via Browsersync.
- browserify-transform - Use Browserify transforms in a build.
- command - Run commands and call functions when bundles are generated.
- conditional – Conditionally execute plugins.
- execute - Execute shell commands sequentially during a build.
- html-entry – Allows use HTML Script Tags as entry points.
- incremental - Recompile only changed modules in watch mode.
- jscc – Conditional compilation and declaration of ES6 imports.
- make - Build dependency files suitable for make.
- off-main-thread - Use ES6 modules with Web Workers.
- polyfill-node - A modern Node.js polyfill.
- sourcemaps – Load external source maps from URIs.
Packages
Core Packages
Packages created and maintained by the Rollup organization.
- @rollup/pluginutils - Functions commonly used by Rollup plugins.
Community Packages
- deno-rollup - Use Rollup in Deno projects.
- fruit - Build a Rollup boilerplate in seconds.
- grunt-rollup - Grunt plugin for Rollup
- rollup-starter-app - Create a bare-bones application using Rollup.
- rollup-starter-lib - Create a bare-bones library using Rollup.
- rollup-stream - A wrapper for streaming Rollup results.