babel-plugin-flow-to-typescript

0.6.0 verified Sat Apr 25 auth: no javascript maintenance

Babel plugin to convert Flow type annotations into TypeScript. Current stable version: 0.6.0. Release cadence is low (last release June 2018). Key differentiator: transforms Flow syntax (exact types, opaque types, $Keys, etc.) directly in Babel pipeline. No type inference, but covers most Flow constructs including maybe types, function types, object types, and utility types like $Diff and $Shape. Requires @babel/core ^7.4.4. Not actively maintained; no support for newer Flow features or TypeScript 3+ syntax.

Common errors

error Error: Cannot find module '@babel/core' ↓

cause @babel/core not installed or wrong version.

fix

npm install --save-dev @babel/core@^7.4.4

error TypeError: Cannot read property 'convert' of undefined ↓

cause Plugin not found or incorrectly referenced in Babel config.

fix

Ensure plugin is installed and string name used in plugins array: 'babel-plugin-flow-to-typescript'

error SyntaxError: Unexpected token (1:8) - You may need an appropriate loader to handle this file type. ↓

cause Babel not configured to handle Flow syntax before conversion.

fix

Add '@babel/preset-flow' or '@babel/plugin-syntax-flow' before this plugin in plugins array.

Warnings

breaking Requires @babel/core ^7.4.4. Older versions may fail. ↓

fix Update @babel/core to ^7.4.4 or later.

deprecated Unmaintained since June 2018. No support for TypeScript 3+ features or newer Flow syntax like $ReadOnlyArray. ↓

fix Consider using flow-to-typescript or a manual migration script for modern Flow/TypeScript.

gotcha Does not handle Flow import type syntax fully; import type A from 'module' becomes import A from 'module' (removes type-only), which may cause runtime errors if module has no default export. ↓

fix Manually review imports after conversion; use type-only imports in TypeScript with 'import type'.

gotcha Transforms $FlowFixMe to any, which may hide real type errors. ↓

fix Replace $FlowFixMe comments with TypeScript's '// @ts-ignore' or proper types manually.

Install

npm install babel-plugin-flow-to-typescript

yarn add babel-plugin-flow-to-typescript

pnpm add babel-plugin-flow-to-typescript

Imports

plugin

wrong

{
  plugins: [require('babel-plugin-flow-to-typescript')]
}

correct

{
  plugins: ['babel-plugin-flow-to-typescript']
}

Add to Babel config as a plugin string. With @babel/core 7+, use the string name.

module/require usage
wrong
```
import plugin from 'babel-plugin-flow-to-typescript';
```
correct
```
const plugin = require('babel-plugin-flow-to-typescript');
```
CommonJS require works; ESM default import may fail if package lacks 'default' export.
Babel config (babel.config.js)
```
module.exports = {
  plugins: ['babel-plugin-flow-to-typescript']
};
```
Standard Babel config file. No special syntax.

Quickstart

Converts a Flow function with maybe type (?string) to TypeScript union with null and undefined.

// Install CLI and plugin
// npm install -g @babel/cli @babel/core
// npm install babel-plugin-flow-to-typescript

// Run conversion on a Flow file
// babel --plugins babel-plugin-flow-to-typescript input.js -o output.ts

// Example input (Flow):
// // @flow
// function greet(name: ?string): string {
//   return 'Hello ' + (name || 'world');
// }

// Example output (TypeScript):
function greet(name: string | null | undefined): string {
  return 'Hello ' + (name || 'world');
}