tessl/npm-babel--helper-create-class-features-plugin

Babel helper plugin that provides essential functionality for transforming modern JavaScript class features to ES6-compatible code

—

Pending

Quality

Pending

Does it follow best practices?

Impact

Pending

No eval scenarios have been run

Securityby

Pending

The risk profile of this skill

Overview

Eval results

Files

Plugin Creation

Name: tessl/npm-babel--helper-create-class-features-plugin
Author: tessl

The primary factory function for creating Babel plugins that transform class features with configurable options and feature flags.

Capabilities

Create Class Feature Plugin

Creates a configured Babel plugin for transforming specific class features.

/**
 * Creates a Babel plugin for transforming class features
 * @param options - Configuration options for the plugin
 * @returns Configured PluginObject ready for use in Babel
 */
function createClassFeaturePlugin(options: Options): PluginObject;

interface Options {
  /** The name of the plugin */
  name: string;
  /** Feature flags indicating which class features to transform */
  feature: number;
  /** Whether to use loose mode transformations */
  loose?: boolean;
  /** Babel plugin inheritance configuration */
  inherits?: PluginObject["inherits"];
  /** Parser options manipulation function */
  manipulateOptions?: PluginObject["manipulateOptions"];
  /** Babel plugin API instance */
  api?: PluginAPI;
  /** Decorator specification version to use */
  decoratorVersion?: DecoratorVersionKind | "2018-09";
}

type DecoratorVersionKind = 
  | "2023-11" | "2023-05" | "2023-01" 
  | "2022-03" | "2021-12";

Usage Examples:

import { createClassFeaturePlugin, FEATURES } from "@babel/helper-create-class-features-plugin";

// Basic class properties plugin
export default createClassFeaturePlugin({
  name: "transform-class-properties",
  api,
  feature: FEATURES.fields,
  loose: options.loose,
});

// Private methods plugin with combined features
export default createClassFeaturePlugin({
  name: "transform-private-methods",
  api,
  feature: FEATURES.privateMethods | FEATURES.fields,
  loose: options.loose,
  manipulateOptions(opts, parserOpts) {
    parserOpts.plugins.push("classPrivateMethods");
  },
});

// Decorators plugin with specific version
export default createClassFeaturePlugin({
  name: "transform-decorators",
  api,
  feature: FEATURES.decorators,
  decoratorVersion: "2023-11",
});

// Complex plugin with inheritance
export default createClassFeaturePlugin({
  name: "transform-class-static-blocks",
  api,
  feature: FEATURES.staticBlocks,
  inherits: require("@babel/plugin-syntax-class-static-block").default,
  manipulateOptions(opts, parserOpts) {
    parserOpts.plugins.push("classStaticBlock");
  },
});

Plugin Object Structure

The returned plugin object follows standard Babel plugin structure:

interface PluginObject {
  name: string;
  manipulateOptions?: (opts: any, parserOpts: any) => void;
  inherits?: PluginObject;
  pre?: (file: File) => void;
  visitor: {
    Class(path: NodePath<t.Class>, state: any): void;
    ExportDefaultDeclaration?(path: NodePath<t.ExportDefaultDeclaration>, state: any): void;
  };
}

Feature Combination

Features can be combined using bitwise OR operations:

// Multiple features
const combinedFeatures = FEATURES.fields | FEATURES.privateMethods | FEATURES.privateIn;

// Check if feature is enabled
const hasFields = feature & FEATURES.fields;
const hasPrivateMethods = feature & FEATURES.privateMethods;

Decorator Version Support

The plugin supports multiple decorator specification versions:

"2018-09": Legacy decorator support (pre-standardization)
"2021-12": Early stage-3 decorator proposal
"2022-03": Updated stage-3 decorator proposal
"2023-01": Refined stage-3 decorator proposal
"2023-05": Near-final stage-3 decorator proposal
"2023-11": Final stage-3 decorator specification (default in Babel 8)

Loose Mode Configuration

Loose mode provides faster, less spec-compliant transformations:

// Strict mode (default) - fully spec-compliant
createClassFeaturePlugin({
  name: "my-plugin",
  feature: FEATURES.fields,
  loose: false
});

// Loose mode - faster but less compliant
createClassFeaturePlugin({
  name: "my-plugin", 
  feature: FEATURES.fields,
  loose: true
});

Loose mode assumptions: