flow-babel-webpack-plugin

1.1.1 verified Sat Apr 25 auth: no javascript deprecated

Flow Babel Webpack Plugin (v1.1.1, last released in 2017) is a Webpack plugin that integrates Flow type checking into the Webpack build process using Babel to strip type annotations via transform-flow-comments. It provides real-time Flow error or warning reports in the Webpack output. Unlike alternatives like flow-webpack-plugin or babel-plugin-transform-flow-strip-types, this plugin specifically works with the transform-flow-comments approach to preserve type annotations as comments for Flow checks, while also allowing custom error formatting and warning-only mode. The package has not been updated in years and likely has compatibility issues with modern Webpack (4/5) and Babel (7+); it targets Webpack 1.x/2.x and Babel 6.

Common errors

error Error: Cannot find module 'flow-babel-webpack-plugin' ↓

cause Package not installed or typo in package name.

fix

Run 'npm install flow-babel-webpack-plugin' (note: it's not 'flow-babel-webpack', missing hyphen).

error TypeError: FlowBabelWebpackPlugin is not a constructor ↓

cause Using import/require incorrectly; the plugin exports a single constructor, but attempting destructuring or using without 'new'.

fix

Use: const FlowBabelWebpackPlugin = require('flow-babel-webpack-plugin'); new FlowBabelWebpackPlugin();

error Module build failed: Error: Cannot find module 'babel-plugin-transform-flow-comments' ↓

cause Missing babel-plugin-transform-flow-comments in devDependencies or .babelrc references it incorrectly.

fix

Run 'npm install --save-dev babel-plugin-transform-flow-comments' and ensure .babelrc contains the plugin.

error flow: command not found ↓

cause Flow is not installed or not in PATH when webpack runs.

fix

Add 'flow-bin' as devDependency and run webpack from project root where node_modules/.bin is accessible.

error Unhandled 'error' event: Error: spawn flow ENOENT (or similar) ↓

cause Flow binary not found or not executable.

fix

Ensure flow-bin is installed: npm install --save-dev flow-bin; also check that 'flow' works from command line in project directory.

Warnings

breaking This plugin only works with Webpack v1.x or v2.x. Webpack v4/v5 use different plugin API and this plugin will fail silently or throw errors. ↓

fix Migrate to flow-webpack-plugin (if available) or remove this plugin and run Flow separately via CLI or script.

gotcha Requires babel-plugin-transform-flow-comments to be in .babelrc; using babel-plugin-transform-flow-strip-types will strip type annotations and Flow will not run. ↓

fix Ensure .babelrc contains 'transform-flow-comments' (not 'transform-flow-strip-types').

deprecated Package is not maintained since 2017; no support for Babel 7, Webpack >=3, or Flow >=0.80. ↓

fix Consider using alternative tools like 'flow-remove-types' or running Flow separately.

gotcha If Flow is not installed globally or in node_modules, the plugin will fail with 'flow: not found' error. ↓

fix Install flow-bin as a devDependency: npm i -D flow-bin and ensure node_modules/.bin is in PATH when running webpack.

gotcha The plugin does not support options like failOnError (only 'warn' boolean). ↓

fix Handle errors differently if needed; no alternative option available.

Install

npm install flow-babel-webpack-plugin

yarn add flow-babel-webpack-plugin

pnpm add flow-babel-webpack-plugin

Imports

default

wrong

import FlowBabelWebpackPlugin from 'flow-babel-webpack-plugin';

correct

const FlowBabelWebpackPlugin = require('flow-babel-webpack-plugin');

Package does not export named exports or support ESM. Use CommonJS require().

FlowBabelWebpackPlugin

wrong

const { FlowBabelWebpackPlugin } = require('flow-babel-webpack-plugin');

correct

const FlowBabelWebpackPlugin = require('flow-babel-webpack-plugin'); const plugin = new FlowBabelWebpackPlugin({ warn: true });

Only default export is available. Destructuring will fail.

new FlowBabelWebpackPlugin()
wrong
```
plugins: [ FlowBabelWebpackPlugin ]
```
correct
```
plugins: [ new FlowBabelWebpackPlugin() ]
```
Must instantiate with new. Passing the class reference will not work.

Quickstart

Shows setup of .babelrc and webpack.config.js to run Flow type checking via Webpack plugin.

// Install dependencies
// npm i -D babel-core@6 babel-loader@7 webpack@2 babel-plugin-transform-flow-comments flow-babel-webpack-plugin

// .babelrc
{ "plugins": ["transform-flow-comments"] }

// webpack.config.js
const FlowBabelWebpackPlugin = require('flow-babel-webpack-plugin');

module.exports = {
  entry: './index.js',
  output: { filename: 'build.js' },
  module: {
    loaders: [
      { test: /\.js$/, loader: 'babel' }
    ]
  },
  plugins: [
    new FlowBabelWebpackPlugin({
      warn: false,
      formatter: function (errorCode, errorDetails) {
        return 'Flow error ' + errorCode + ': ' + errorDetails;
      }
    })
  ]
};