1. Habit
  2. Skills
  3. Flow skill
react · 1K installs

Flow skill
Runs by itself, pull request updated.

No Flow errors reach main.

Install the Flow skill and make it a habit: follow https://gethabit.dev/skills/react/flow.md

  1. 1Copy
  2. 2Paste into Claude Code, Codex or Cursor
  3. 3It runs by itself

1K installs252K starsMIT licenceSource on GitHub ↗

Flow

by react · 1K installs

The skill

The flow skill runs Flow type checking in the React repository for a chosen renderer and reports type errors with file locations, for contributors who change React code or see Flow errors.

Only when you ask.

The habit

No Flow errors reach main.

↻ Runs by itselfpull request updated

How the habit works.
You don't have to.

Three questionsWhen does it start? How does it check its work? What does it remember?

01

It starts by itself

pull request updated. Runs in GitHub Actions or Claude Code routine.

  • ↻ pull request updated
  • pull_request.opened or pull_request.synchronize

02

It checks its work

yarn flow passes. If a check fails, it tells you.

  • ✓yarn flow exits without type errors for the chosen renderer
  • ✓no new $FlowFixMe comment masks a real error
  • ✓yarn flow-ci passes before merge

03

It remembers

Flow error count log. The next run reads it first: error counts and suppressions from the last runs.

loops/react-flow-check-loop/runs.md

One run, step by step.
Then it stops.

Stop ruleStops after one pull request per run: one yarn flow pass and one yarn flow-ci pass, no retries.

  1. 01

    Pick the renderer

    Choose dom-node by default, or dom-browser, native or fabric when the change touches that code.

  2. 02

    Run Flow

    Run yarn flow with the chosen renderer and never without one.

  3. 03

    Report errors

    List each type error with its file location.

  4. 04

    Check suppressions

    Look at $FlowFixMe comments in the change and flag any that hide a real problem.

  5. 05

    Check type imports

    Confirm types come from the correct package.

  6. 06

    Full check

    Run the slow yarn flow-ci before merge and log the error count.

What it may do.
Nothing more.

Safe by defaultIt writes only in its own folder and asks you before anything goes out.

Is it for you?
Use it when it fits.

Quick checkRead both lists. If the left one sounds like you, the Flow skill helps.

Use it when

  • ✓ You changed code in the React repo
  • ✓ You see Flow type errors
  • ✓ You need to check a specific renderer

Skip it when

  • – Your project uses TypeScript, not Flow
  • – You work outside the React repository

Questions

Flow skill, answered.

Which renderer should I use?

dom-node is the default and fits most changes; use the others only for browser DOM, React Native or Fabric code.

Why run yarn flow-ci too?

It is the comprehensive check. It is slow, so the loop runs it once before merge.

Does it fix the errors?

No. The skill reports type errors with locations; fixing them is up to you or another step.

How do I install the Flow skill?

Copy the prompt at the top into your agent. It installs the skill from react/react and sets up the habit. Or run npx skills add react/react --skill flow.

Is the Flow skill free?

Yes. It is published under MIT. Habit is free too.

Flow. Now as a habit.

Install the Flow skill and make it a habit: follow https://gethabit.dev/skills/react/flow.md

  • Free
  • No account
  • Undo in one line

All react skills →More code skills →

Works in

  • Claude Code
  • Codex
  • Cursor
  • ChatGPT
  • Claude app

Made by react, published under MIT. Habit links to the original and never changes it. Is this your skill?

Copying didn't work here. Select the line and copy it by hand.