or run

npx @tessl/cli init
Log in

Version

Tile

Overview

Evals

Files

docs

index.md
tile.json

tessl/npm-babel-plugin-transform-flow-strip-types

Strip flow type annotations from your output code.

Workspace
tessl
Visibility
Public
Created
Last updated
Describes
npmpkg:npm/babel-plugin-transform-flow-strip-types@6.22.x

To install, run

npx @tessl/cli install tessl/npm-babel-plugin-transform-flow-strip-types@6.22.0

index.mddocs/

babel-plugin-transform-flow-strip-types

babel-plugin-transform-flow-strip-types is a Babel plugin that strips all Flow type annotations and declarations from your JavaScript code during compilation. It removes Flow-specific syntax while preserving the original JavaScript functionality, making it essential for projects that use Flow for type checking in development but need clean JavaScript output for production.

Package Information

  • Package Name: babel-plugin-transform-flow-strip-types
  • Package Type: npm
  • Language: JavaScript
  • Main Entry: lib/index.js (built from src/index.js)
  • Installation: npm install --save-dev babel-plugin-transform-flow-strip-types

Core Imports

// Default export - the plugin factory function
const flowStripTypes = require("babel-plugin-transform-flow-strip-types");

ES6 import:

import flowStripTypes from "babel-plugin-transform-flow-strip-types";

Note: The plugin exports a single default function that serves as the plugin factory.

Basic Usage

Via .babelrc (Recommended)

{
  "plugins": ["transform-flow-strip-types"]
}

Via CLI

babel --plugins transform-flow-strip-types script.js

Via Node API

const babel = require("babel-core");

const result = babel.transform(sourceCode, {
  plugins: ["transform-flow-strip-types"]
});

Architecture

The plugin operates as part of the Babel AST transformation pipeline. It inherits Flow syntax parsing capabilities from babel-plugin-syntax-flow and implements visitor methods that traverse the AST to remove Flow-specific nodes while preserving JavaScript functionality.

Capabilities

Plugin Factory Function

The main export is a function that creates a Babel plugin when provided with Babel's types object.

/**
 * Creates a Babel plugin that strips Flow type annotations
 * @param {Object} babel - Babel plugin options object (automatically provided by Babel)
 * @param {Object} babel.types - Babel types helper object (t)
 * @returns {Object} Babel plugin configuration object with inherits and visitor properties
 */
function flowStripTypesPlugin({ types: t }) {
  return {
    inherits: BabelPlugin,
    visitor: VisitorObject
  };
}

Usage Example:

// Typically used automatically by Babel when plugin is configured
const plugin = require("babel-plugin-transform-flow-strip-types");

// Manual plugin instantiation (rarely needed)
const babel = require("babel-core");
const babelTypes = require("babel-types");
const pluginInstance = plugin({ types: babelTypes });

// Plugin is applied during Babel transformation process
const result = babel.transform(code, {
  plugins: [plugin] // Babel handles plugin instantiation automatically
});

Plugin Configuration Object

The plugin factory returns a Babel plugin configuration object with the following structure:

interface BabelPlugin {
  /** Inherits Flow syntax parsing from babel-plugin-syntax-flow */
  inherits: BabelPlugin;
  
  /** AST visitor methods for transforming Flow syntax */
  visitor: {
    /** Handles program-level directives and comments */
    Program: (path: NodePath<Program>, state: PluginPass) => void;
    /** Removes Flow type declarations and annotations */
    Flow: (path: NodePath<FlowType>) => void;
    /** Handles class property type annotations and variance */
    ClassProperty: (path: NodePath<ClassProperty>) => void;
    /** Removes class implements clauses and processes properties */
    Class: (path: NodePath<Class>) => void;
    /** Removes optional parameter annotations */
    AssignmentPattern: (opts: { node: Node }) => void;
    /** Removes optional parameter flags from function parameters */
    Function: (opts: { node: Node }) => void;
    /** Unwraps type cast expressions to their inner expressions */
    TypeCastExpression: (path: NodePath<TypeCastExpression>) => void;
  };
}

interface NodePath<T = Node> {
  node: T;
  remove(): void;
  replaceWith(node: Node): void;
  get(key: string): NodePath | NodePath[];
}

interface PluginPass {
  file: {
    ast: {
      comments: Comment[];
    };
  };
}

interface Comment {
  value: string;
  ignore?: boolean;
}

Flow Syntax Transformations

The plugin handles the following Flow syntax transformations:

Flow Directive Comments

Removes or cleans up @flow directive comments from the top of files.

Input:

// @flow
function foo() {}

Output:

function foo() {}

Type Annotations

Removes type annotations from function parameters, return types, and variable declarations.

Input:

function foo(one: any, two: number, three?): string {}
const x: number = 5;

Output:

function foo(one, two, three) {}
const x = 5;

Class Features

Removes type annotations from class properties, implements clauses, and variance annotations.

Input:

class Example implements SomeInterface {
  +property: string;
  -readOnlyProp: number;
  method(): void {}
}

Output:

class Example {
  method() {}
}

Variance Annotations

Removes variance annotations (+ for covariant, - for contravariant) from class properties.

Input:

class Container<T> {
  +covariant: T;
  -contravariant: T;
  invariant: T;
}

Output:

class Container {
  invariant;
}

Type Declarations

Removes Flow type aliases, interface declarations, and other Flow-specific declarations.

Input:

type MyType = string | number;
interface MyInterface {
  prop: string;
}

Output:

// These declarations are completely removed

Type Cast Expressions

Unwraps type cast expressions to their underlying expressions.

Input:

const value = (someExpression: SomeType);

Output:

const value = someExpression;

Generic Types and Qualified Types

Removes generic type parameters and qualified type references.

Input:

const a: Array<string> = [];
const b: A.B.C = value;

Output:

const a = [];
const b = value;

Tuple Types

Removes tuple type annotations.

Input:

const tuple: [string, number] = ["hello", 42];

Output:

const tuple = ["hello", 42];

Function Default Parameter Types

Handles optional parameters and default values with Flow types.

Input:

function foo(numVal?: number = 2) {}
function bar(str: string = "default") {}

Output:

function foo(numVal = 2) {}
function bar(str = "default") {}

String Literal Types

Removes string literal type annotations.

Input:

const status: "pending" | "complete" = "pending";

Output:

const status = "pending";

Declare Statements

Removes Flow declare statements entirely.

Input:

declare function foo(): void;
declare var x: number;
declare module "some-module" {
  export function bar(): string;
}

Output:

// These declarations are completely removed

Error Handling

The plugin does not throw errors during transformation. It silently removes Flow syntax and preserves valid JavaScript code. If the input contains invalid Flow syntax, the parsing error would occur at the Babel parser level before this plugin runs.

Dependencies

The plugin requires:

  • babel-plugin-syntax-flow: ^6.18.0 - Provides Flow syntax parsing capabilities
  • babel-runtime: ^6.22.0 - Babel runtime helpers

Compatibility

  • Compatible with Babel 6.x
  • Works with all Flow syntax supported by babel-plugin-syntax-flow version 6.18.0
  • Designed for JavaScript codebases using Flow type annotations
  • Output is clean JavaScript compatible with any JavaScript runtime