CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-rollup--plugin-babel

Seamless integration between Rollup and Babel enabling transpilation during bundling with multiple helper strategies.

—

Pending
Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

SecuritybySnyk

Pending

The risk profile of this skill

Overview
Eval results
Files

@rollup/plugin-babel

@rollup/plugin-babel provides seamless integration between Rollup and Babel, enabling developers to transpile ES6/7 code during the bundling process. It offers multiple helper handling strategies and supports both input and output transformation modes with comprehensive configuration options.

Package Information

  • Package Name: @rollup/plugin-babel
  • Package Type: npm
  • Language: JavaScript/TypeScript
  • Installation: npm install @rollup/plugin-babel --save-dev

Core Imports

import { babel } from '@rollup/plugin-babel';

For specific functions:

import { 
  babel, 
  getBabelInputPlugin, 
  getBabelOutputPlugin,
  createBabelInputPluginFactory,
  createBabelOutputPluginFactory 
} from '@rollup/plugin-babel';

Using default export:

import babel from '@rollup/plugin-babel';
// babel is an alias for getBabelInputPlugin

For CommonJS:

const { babel, getBabelInputPlugin, getBabelOutputPlugin } = require('@rollup/plugin-babel');
// or
const babel = require('@rollup/plugin-babel').default;

Basic Usage

import { babel } from '@rollup/plugin-babel';

const config = {
  input: 'src/index.js',
  output: {
    dir: 'output',
    format: 'es'
  },
  plugins: [babel({ babelHelpers: 'bundled' })]
};

export default config;

Architecture

@rollup/plugin-babel is built around several key components:

  • Input Transformation: babel() and getBabelInputPlugin() transform source files during the input phase
  • Output Transformation: getBabelOutputPlugin() transforms generated chunks during the output phase
  • Helper Strategies: Four different approaches for handling Babel helpers (bundled, runtime, inline, external)
  • Factory Functions: createBabelInputPluginFactory() and createBabelOutputPluginFactory() for custom plugin creation
  • Configuration System: Comprehensive options handling with validation and defaults
  • Filter System: Advanced file filtering with include/exclude patterns and custom filter functions

Capabilities

Input Plugin

Primary plugin function for transforming source files during input processing. Supports comprehensive Babel configuration and file filtering.

function babel(options?: RollupBabelInputPluginOptions): Plugin;
function getBabelInputPlugin(options?: RollupBabelInputPluginOptions): Plugin;

interface RollupBabelInputPluginOptions extends Omit<BabelTransformOptions, 'include' | 'exclude'> {
  include?: FilterPattern;
  exclude?: FilterPattern;
  filter?: ReturnType<CreateFilter>;
  extensions?: string[];
  babelHelpers?: 'bundled' | 'runtime' | 'inline' | 'external';
  skipPreflightCheck?: boolean;
}

Input Plugin

Output Plugin

Plugin for transforming output chunks after bundle generation. Ideal for compatibility transformations and format-specific optimizations.

function getBabelOutputPlugin(options?: RollupBabelOutputPluginOptions): Plugin;

interface RollupBabelOutputPluginOptions extends Omit<BabelTransformOptions, 'include' | 'exclude'> {
  allowAllFormats?: boolean;
}

Output Plugin

Custom Plugin Factories

Advanced factory functions for creating custom Babel plugins with specialized configuration and processing logic.

function createBabelInputPluginFactory(
  customCallback?: RollupBabelCustomInputPluginBuilder
): typeof getBabelInputPlugin;

function createBabelOutputPluginFactory(
  customCallback?: RollupBabelCustomOutputPluginBuilder
): typeof getBabelOutputPlugin;

type RollupBabelCustomInputPluginBuilder = (
  babel: typeof babelCore
) => RollupBabelCustomInputPlugin;

type RollupBabelCustomOutputPluginBuilder = (
  babel: typeof babelCore
) => RollupBabelCustomOutputPlugin;

Custom Plugin Factories

Core Types

// From @rollup/pluginutils
type FilterPattern = string | RegExp | Array<string | RegExp>;
type CreateFilter = (include?: FilterPattern, exclude?: FilterPattern, options?: FilterOptions) => (id: string | unknown) => boolean;

interface FilterOptions {
  resolve?: string | false | null;
}

// From rollup
interface Plugin {
  name: string;
  options?(): void;
  resolveId?(id: string): string | null;
  load?(id: string): string | null;
  transform?(code: string, filename: string): TransformResult | null;
  renderStart?(outputOptions: OutputOptions): void;
  renderChunk?(code: string, chunk: RenderedChunk, outputOptions: OutputOptions): TransformResult | null;
}

interface TransformPluginContext {
  error(message: string): never;
  warn(message: string): void;
  // ... other context methods
}

interface PluginContext {
  error(message: string): never;
  warn(message: string): void;
  // ... other context methods
}

interface TransformResult {
  code: string;
  map?: SourceMap;
}

interface SourceMap {
  version: number;
  sources: string[];
  names: string[];
  mappings: string;
  file?: string;
  sourcesContent?: string[];
}

// From @babel/core
interface BabelTransformOptions {
  filename?: string;
  filenameRelative?: string;
  presets?: any[];
  plugins?: any[];
  sourceMaps?: boolean;
  sourceType?: 'script' | 'module' | 'unambiguous';
  // ... other Babel options
}

interface BabelPartialConfig {
  options: BabelTransformOptions;
  hasFilesystemConfig(): boolean;
}

interface BabelFileResult {
  code: string;
  map?: object;
  ast?: object;
}

// Custom plugin interfaces
interface RollupBabelCustomInputPlugin {
  options?: RollupBabelCustomInputPluginOptions;
  config?: RollupBabelCustomInputPluginConfig;
  result?: RollupBabelCustomInputPluginResult;
}

interface RollupBabelCustomOutputPlugin {
  options?: RollupBabelCustomOutputPluginOptions;
  config?: RollupBabelCustomOutputPluginConfig;
  result?: RollupBabelCustomOutputPluginResult;
}

type RollupBabelCustomInputPluginOptions = (
  options: RollupBabelInputPluginOptions & Record<string, any>
) => {
  customOptions: Record<string, any>;
  pluginOptions: RollupBabelInputPluginOptions;
};

type RollupBabelCustomOutputPluginOptions = (
  options: RollupBabelOutputPluginOptions & Record<string, any>
) => {
  customOptions: Record<string, any>;
  pluginOptions: RollupBabelOutputPluginOptions;
};

interface RollupBabelCustomPluginConfigOptions {
  code: string;
  customOptions: Record<string, any>;
}

interface RollupBabelCustomPluginResultOptions {
  code: string;
  customOptions: Record<string, any>;
  config: BabelPartialConfig;
  transformOptions: BabelTransformOptions;
}

type RollupBabelCustomInputPluginConfig = (
  this: TransformPluginContext,
  cfg: BabelPartialConfig,
  options: RollupBabelCustomPluginConfigOptions
) => BabelTransformOptions;

type RollupBabelCustomInputPluginResult = (
  this: TransformPluginContext,
  result: BabelFileResult,
  options: RollupBabelCustomPluginResultOptions
) => BabelFileResult;

type RollupBabelCustomOutputPluginConfig = (
  this: PluginContext,
  cfg: BabelPartialConfig,
  options: RollupBabelCustomPluginConfigOptions
) => BabelTransformOptions;

type RollupBabelCustomOutputPluginResult = (
  this: PluginContext,
  result: BabelFileResult,
  options: RollupBabelCustomPluginResultOptions
) => BabelFileResult;
Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/@rollup/plugin-babel@6.0.x
Publish Source
CLI
Badge
tessl/npm-rollup--plugin-babel badge