Flow JavaScript Parser

Common errors

• TypeError: flowParser.parse is not a function

  cause Attempting to call `flowParser.parse()` after `require('flow-parser')` when `flow-parser` does not export a direct `parse` function, but rather an object that contains the `parse` method.
  fix Access the `parse` method as a property of the imported object: `const flowParser = require('flow-parser'); flowParser.parse('code', {});`

• SyntaxError: Unexpected token (X:Y)

  cause Using Flow-specific syntax (e.g., enums, components, decorators) without enabling the corresponding parsing option.
  fix Pass the appropriate option to `flowParser.parse()`, for example, `flowParser.parse(code, { enums: true, components: true });`

Warnings

• breaking The AST structure for Enum body nodes has been significantly refactored. The five specific enum body ESTree node types (`EnumBooleanBody`, `EnumNumberBody`, etc.) have been replaced with a single `EnumBody` node. Its `members` property is now a flat array of per-type member nodes, and `explicitType` is a string or `null` instead of a boolean.
  Fix: Update AST traversal logic and type checks to accommodate the new `EnumBody` structure and its `members` property for accessing individual enum members.
• breaking Parsing now errors when an optional modifier `?` appears in invalid contexts, such as `const x? = 1;`. Code that previously parsed but was syntactically incorrect in Flow will now throw a `ParseError`.
  Fix: Ensure that the code being parsed adheres strictly to Flow's grammar for optional modifiers, removing any incorrect usages.
• gotcha Many Flow-specific language features, such as `enums`, `match` expressions, `components`, and `esproposal_decorators`, require explicit enabling via options passed to the `parse` method. By default, these advanced features are not parsed.
  Fix: Always provide an options object to `flowParser.parse()` and set the relevant boolean flags (e.g., `enums: true`, `components: true`) to `true` for features present in the source code.

Install

• npm install flow-parser npm
• yarn add flow-parser yarn
• pnpm add flow-parser pnpm

Imports

• parse
  wrong:

  import { parse } from 'flow-parser';

  correct:

  const flowParser = require('flow-parser');
  flowParser.parse('code', {});

  The primary API is accessed via a property on the default CommonJS export. Direct named ESM imports are not typically supported for the top-level `parse` function.
• flow

  <script src="flow_parser.js"></script>
  <script>
    flow.parse('code', {});
  </script>

  When used in a browser environment via a `<script>` tag, the parser exposes a global `flow` object. Ensure `flow_parser.js` is loaded first.

Quickstart

Demonstrates how to parse a Flow-typed JavaScript code snippet using the `flow-parser` in Node.js, enabling Flow types and specific features like enums, and logging the root AST type and specific node names.

const flowParser = require('flow-parser');

const code = `
  // @flow
  enum Status { Active, Inactive };
  function greet(name: string): string {
    return 'Hello, ' + name + '!';
  }
  const status: Status = Status.Active;
`;

const options = {
  types: true, // Enable parsing of Flow types
  comments: true, // Attach comments to AST nodes
  enums: true, // Enable parsing of enums
  tokens: false
};

try {
  const ast = flowParser.parse(code, options);
  console.log('Successfully parsed code. AST root type:', ast.type);
  console.log('Function declaration:', ast.body.find(node => node.type === 'FunctionDeclaration').id.name);
  console.log('Enum declaration:', ast.body.find(node => node.type === 'EnumDeclaration').id.name);
} catch (e) {
  console.error('Parsing error:', e.message);
}