Skip to content

Use hermes-parser via babel-plugin-syntax-hermes-parser for Flow files#81

Open
jonreading81 wants to merge 2 commits into
blazejkustra:mainfrom
jonreading81:hermes-parser-support
Open

Use hermes-parser via babel-plugin-syntax-hermes-parser for Flow files#81
jonreading81 wants to merge 2 commits into
blazejkustra:mainfrom
jonreading81:hermes-parser-support

Conversation

@jonreading81

Copy link
Copy Markdown

Fixes #80.

Summary

The previous parse step used @babel/parser with the flow plugin, which lags behind Flow's own parser and rejects modern syntax (readonly, component, hook, renders, match, keyof, T[K], x is T, <T extends U>, etc). The extension errored out on any file using those constructs and no marker appeared.

This PR switches to a single transformSync() with babel-plugin-syntax-hermes-parser in the plugin list. Its parserOverride hook swaps in Hermes (Flow's canonical parser) for .js / .jsx / .mjs files, and is a no-op for .ts / .tsx, so TypeScript continues to be parsed by Babel's built-in parser (configured via parserOpts.plugins). Same output shape, same logger contract — only the parser changes.

Verified locally

  • Modern Flow syntax: type Props = { ref?: React.RefObject<{ readonly closeMenu: () => void }> } — now compiles cleanly (was throwing at parse time).
  • TypeScript: React.FC<Props> with type annotations — continues to compile without regression.
  • Legit bailout (ref access during render) — still emits the correct "Cannot access refs during render" diagnostic.

Alternatives considered

The original suggestion in #80 was a separate SWC Flow-strip pass. Your feedback pointed at babel-plugin-syntax-hermes-parser as cleaner — same Babel run, no SWC dependency, uses Flow's canonical parser. I agree and went with that.

Notes

  • Added babel-plugin-syntax-hermes-parser@^0.36.1 to packages/server/dependencies.
  • Removed the intermediate BabelParser.parse() step — now a single transformSync(). @babel/parser remains a dep but is unused in the server source after this change; left in to keep the diff minimal.

Fixes blazejkustra#80. The previous parse step used @babel/parser with the "flow"
plugin, which lags behind Flow's own parser and rejects modern syntax
(readonly, component, hook, renders, match, keyof, T[K], x is T,
<T extends U>, etc). The extension errored out on any file using those
constructs and no marker appeared.

Switch to a single transformSync() with babel-plugin-syntax-hermes-parser
in the plugin list. Its parserOverride hook swaps in Hermes (Flow's
canonical parser) for .js / .jsx / .mjs files and is a no-op for
.ts / .tsx, so TypeScript continues to be parsed by Babel's built-in
parser (configured via parserOpts.plugins). Same output shape,
same logger contract — only the parser changes.

Verified locally against:

- Modern Flow: `type Props = { ref?: React.RefObject<{ readonly ... }> }`
  now compiles cleanly (was throwing at parse time).
- TypeScript: `React.FC<Props>` with type annotations continues to
  compile without regression.
- Legit bailout (ref access during render): still emits the correct
  "Cannot access refs during render" diagnostic.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

LSP server fails to parse files that use modern Flow syntax

1 participant