Rollup — это сборщик модулей для JavaScript, объединяющий фрагменты кода в оптимизированные библиотеки или приложения.
Базовая конфигурация (rollup.config.mjs)
import resolve from '@rollup/plugin-node-resolve';
import commonjs from '@rollup/plugin-commonjs';
import terser from '@rollup/plugin-terser';
export default {
input: 'src/index.js',
output: [
{ file: 'dist/bundle.cjs.js', format: 'cjs' },
{ file: 'dist/bundle.esm.js', format: 'es' },
{ file: 'dist/bundle.min.js', format: 'umd', name: 'MyLibrary', plugins: [terser()] }
],
plugins: [resolve(), commonjs()],
external: ['react', 'react-dom']
};
Форматы вывода (Output Formats)
| Format | Option | Target |
|---|---|---|
| ES Module | es / esm |
import / export |
| CommonJS | cjs |
Node.js (require) |
| UMD | umd |
Browser / AMD / CJS |
| IIFE | iife |
Global Browser Bundle |
Использование CLI и основные плагины
# Bundle with configuration file
npx rollup -c
# Watch for changes and rebuild automatically
npx rollup -c -w
# Override environment variables
npx rollup -c --environment BUILD:production
@rollup/plugin-node-resolve: Resolves third-party modules innode_modules.@rollup/plugin-commonjs: Converts CommonJS modules to ES6.@rollup/plugin-typescript: Compiles TypeScript files.@rollup/plugin-terser: Minifies output bundles.