@babel/preset-flow

What is @babel/preset-flow?

The @babel/preset-flow npm package is a Babel preset for transforming Flow syntax. Flow is a static type checker for JavaScript, and this preset allows developers to strip Flow types from their source code to make it compatible with standard JavaScript environments. This is useful for projects that use Flow for type checking but need to remove the type annotations for production builds.

What are @babel/preset-flow's main functionalities?

Type Annotations Stripping

This code sample shows a class with Flow type annotations. The @babel/preset-flow will remove the ': number' type annotations when transforming the code.

class MyClass {
  size: number;

  constructor(size: number) {
    this.size = size;
  }
}

Interface Stripping

This code sample defines a Flow interface. The @babel/preset-flow will remove the entire interface declaration when transforming the code.

interface Serializable {
  serialize(): string;
}

Type Alias Removal

This code sample shows a Flow type alias. The @babel/preset-flow will remove the type alias when transforming the code.

type Point = {
  x: number,
  y: number
};

Other packages similar to @babel/preset-flow

@babel/preset-typescript

Similar to @babel/preset-flow, this package is used to strip TypeScript types from the source code to convert it into plain JavaScript. It serves a similar purpose for TypeScript as @babel/preset-flow does for Flow.

flow-remove-types

This package is a lightweight alternative to Babel for removing Flow type annotations from files. It is faster and simpler but does not offer the extensive plugin system and transformations that Babel provides.

README

@babel/preset-flow

Babel preset for all Flow plugins.

See our website @babel/preset-flow for more information or the issues associated with this package.

Install

Using npm:

npm install --save-dev @babel/preset-flow

or using yarn:

yarn add @babel/preset-flow --dev

Changelog

v7.25.7 (2024-10-02)

:bug: Bug Fix

• babel-helper-validator-identifier
  • #16825 fix: update identifier to unicode 16 (@JLHwung)
• babel-traverse
  • #16814 fix: issue with node path keys updated on unrelated paths (@DylanPiercey)
• babel-plugin-transform-classes
  • #16797 Use an inclusion rather than exclusion list for super() check (@nicolo-ribaudo)
• babel-generator
  • #16788 Fix printing of TS infer in compact mode (@nicolo-ribaudo)
  • #16785 Print TS type annotations for destructuring in assignment pattern (@nicolo-ribaudo)
  • #16778 Respect [no LineTerminator here] after nodes (@nicolo-ribaudo)

:nail_care: Polish

• babel-types
  • #16852 Add deprecated JSDOC for fields (@liuxingbaoyu)

:house: Internal

• babel-core
  • #16820 Allow sync loading of ESM when --experimental-require-module (@nicolo-ribaudo)
• babel-helper-compilation-targets, babel-helper-plugin-utils, babel-preset-env
  • #16858 Add browserslist config to external dependency (@JLHwung)
• babel-plugin-proposal-destructuring-private, babel-plugin-syntax-decimal, babel-plugin-syntax-import-reflection, babel-standalone
  • #16809 Archive syntax-import-reflection and syntax-decimal (@nicolo-ribaudo)
• babel-generator
  • #16779 Simplify logic for [no LineTerminator here] before nodes (@nicolo-ribaudo)

:running_woman: Performance

• babel-plugin-transform-typescript
  • #16875 perf: Avoid extra cloning of namespaces (@liuxingbaoyu)
• babel-types
  • #16842 perf: Improve @babel/types builders (@liuxingbaoyu)
  • #16828 Only access BABEL_TYPES_8_BREAKING at startup (@nicolo-ribaudo)