tessl/npm-rollup--plugin-babel

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

—

Pending

Overview

Eval results

Files

Custom Plugin Factories

Name: tessl/npm-rollup--plugin-babel
Author: tessl

Custom plugin factories allow you to create specialized Babel plugins with custom handling of configuration and transformation logic. They provide access to the exact same Babel core instance used by the plugin and enable advanced customization scenarios.

Capabilities

Input Plugin Factory

Creates a factory function for custom input plugins with specialized configuration handling.

/**
 * Creates a factory for custom input plugins
 * @param customCallback - Callback function for customizing plugin behavior
 * @returns Factory function that creates input plugins
 */
function createBabelInputPluginFactory(
  customCallback?: RollupBabelCustomInputPluginBuilder
): typeof getBabelInputPlugin;

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

Usage Examples:

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

// Create a custom input plugin factory
const customBabelPlugin = createBabelInputPluginFactory((babelCore) => {
  function myCustomPlugin() {
    return {
      visitor: {
        // Custom Babel plugin logic
        FunctionDeclaration(path) {
          // Transform function declarations
        }
      }
    };
  }

  return {
    // Custom options processing
    options({ customOption, ...pluginOptions }) {
      return {
        customOptions: { customOption },
        pluginOptions
      };
    },

    // Custom Babel configuration
    config(cfg, { code, customOptions }) {
      if (cfg.hasFilesystemConfig()) {
        return cfg.options;
      }

      return {
        ...cfg.options,
        plugins: [
          ...(cfg.options.plugins || []),
          myCustomPlugin
        ]
      };
    },

    // Custom result processing
    result(result, { code, customOptions, config, transformOptions }) {
      return {
        ...result,
        code: result.code + '\n// Generated by custom plugin'
      };
    }
  };
});

// Use the custom plugin
export default {
  input: 'src/index.js',
  plugins: [
    customBabelPlugin({
      babelHelpers: 'bundled',
      customOption: 'value'
    })
  ]
};

Output Plugin Factory

Creates a factory function for custom output plugins.

/**
 * Creates a factory for custom output plugins
 * @param customCallback - Callback function for customizing plugin behavior
 * @returns Factory function that creates output plugins
 */
function createBabelOutputPluginFactory(
  customCallback?: RollupBabelCustomOutputPluginBuilder
): typeof getBabelOutputPlugin;

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

Usage Examples:

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

// Create a custom output plugin factory
const customOutputPlugin = createBabelOutputPluginFactory((babelCore) => {
  return {
    options({ format, ...pluginOptions }) {
      return {
        customOptions: { format },
        pluginOptions
      };
    },

    config(cfg, { code, customOptions }) {
      return {
        ...cfg.options,
        presets: [
          ['@babel/preset-env', {
            modules: customOptions.format === 'es' ? false : 'auto'
          }]
        ]
      };
    }
  };
});

// Use the custom plugin
export default {
  input: 'main.js',
  output: {
    file: 'bundle.js',
    format: 'cjs',
    plugins: [customOutputPlugin({ format: 'cjs' })]
  }
};

Custom Plugin Interfaces

Input Plugin Interface

interface RollupBabelCustomInputPlugin {
  /**
   * Custom options processing function
   */
  options?: RollupBabelCustomInputPluginOptions;
  
  /**
   * Custom Babel configuration function
   */
  config?: RollupBabelCustomInputPluginConfig;
  
  /**
   * Custom result processing function
   */
  result?: RollupBabelCustomInputPluginResult;
}

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

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

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

Output Plugin Interface

interface RollupBabelCustomOutputPlugin {
  /**
   * Custom options processing function
   */
  options?: RollupBabelCustomOutputPluginOptions;
  
  /**
   * Custom Babel configuration function
   */
  config?: RollupBabelCustomOutputPluginConfig;
  
  /**
   * Custom result processing function
   */
  result?: RollupBabelCustomOutputPluginResult;
}

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

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

type RollupBabelCustomOutputPluginResult = (
  this: PluginContext,
  result: BabelFileResult,
  options: RollupBabelCustomPluginResultOptions
) => BabelFileResult;

Shared Types and Interfaces

interface RollupBabelCustomPluginConfigOptions {
  /**
   * Source code being transformed
   */
  code: string;
  
  /**
   * Custom options extracted from plugin options
   */
  customOptions: Record<string, any>;
}

interface RollupBabelCustomPluginResultOptions {
  /**
   * Source code being transformed
   */
  code: string;
  
  /**
   * Custom options extracted from plugin options
   */
  customOptions: Record<string, any>;
  
  /**
   * Babel partial configuration object
   */
  config: BabelPartialConfig;
  
  /**
   * Final Babel transform options
   */
  transformOptions: BabelTransformOptions;
}

Advanced Usage Patterns

Framework Integration

Creating a plugin for specific framework needs:

const createReactPlugin = createBabelInputPluginFactory((babel) => {
  return {
    options({ reactVersion, ...options }) {
      return {
        customOptions: { reactVersion },
        pluginOptions: options
      };
    },

    config(cfg, { customOptions }) {
      const reactPreset = customOptions.reactVersion === '17' 
        ? ['@babel/preset-react', { runtime: 'automatic' }]
        : ['@babel/preset-react'];

      return {
        ...cfg.options,
        presets: [
          ...(cfg.options.presets || []),
          reactPreset
        ]
      };
    }
  };
});

Development vs Production

Different behavior for different environments:

const createEnvironmentAwarePlugin = createBabelInputPluginFactory((babel) => {
  return {
    config(cfg, { code }) {
      const isProduction = process.env.NODE_ENV === 'production';
      
      return {
        ...cfg.options,
        plugins: [
          ...(cfg.options.plugins || []),
          ...(isProduction ? [] : ['@babel/plugin-transform-react-jsx-source'])
        ]
      };
    },

    result(result, { customOptions }) {
      if (process.env.NODE_ENV === 'development') {
        // Add development helpers
        return {
          ...result,
          code: result.code + '\n// Development build'
        };
      }
      return result;
    }
  };
});

Base Type Definitions

// 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;
}

// From rollup
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
}

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

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

// Utility types
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;
}

Install with Tessl CLI

npx tessl i tessl/npm-rollup--plugin-babel

docs

custom-plugin-factories.md

tessl/npm-rollup--plugin-babel