Automates Flow type checking and error reporting for React applications.
Install
mkdir -p .claude/skills/flow && curl -L -o skill.zip "https://agentskills.codes/api/skills/download/570" && unzip -o skill.zip -d .claude/skills/flow && rm skill.zipInstalls to .claude/skills/flow
Activation
This is the description your AI agent reads to decide when to run this skill — the better it matches your request, the more reliably it fires.
Use when you need to run Flow type checking, or when seeing Flow type errors in React code.Key capabilities
- →Execute Flow type checking
- →Validate types across different renderers
- →Report file-specific type errors
- →Identify masking issues from suppressions
How it works
The skill executes yarn flow commands targeting specific renderers like dom-node or native to validate type consistency. It identifies errors by scanning code for type mismatches and checking for suppressed issues.
Inputs & outputs
When to use flow
- →Check types in a React project
- →Debug Flow type errors
- →Perform CI-style type validation
About this skill
Flow Type Checking
Arguments:
- $ARGUMENTS: Renderer to check (default: dom-node)
Renderers
| Renderer | When to Use |
|---|---|
dom-node | Default, recommended for most changes |
dom-browser | Browser-specific DOM code |
native | React Native |
fabric | React Native Fabric |
Instructions
- Run
yarn flow $ARGUMENTS(usedom-nodeif no argument) - Report type errors with file locations
- For comprehensive checking (slow), use
yarn flow-ci
Common Mistakes
- Running without a renderer - Always specify or use default
dom-node - Ignoring suppressions - Check if
$FlowFixMecomments are masking real issues - Missing type imports - Ensure types are imported from the correct package
When not to use it
- →When the project does not utilize Flow for type definitions
Limitations
- →Requires explicit renderer specification for non-default environments
How it compares
This workflow automates the execution of specific renderer-based type checks, whereas manual execution requires remembering and typing individual renderer arguments.
Compared to similar skills
flow side by side with the closest alternatives in the catalog.
| Skill | Installs | Updated | Safety | Difficulty |
|---|---|---|---|---|
| flow (this skill) | 7 | 6mo | No flags | Beginner |
| react-best-practices | 22 | 3mo | No flags | Intermediate |
| feature-flags | 6 | 6mo | Review | Intermediate |
| senior-qa | 6 | 2mo | Review | Intermediate |
Try saying
Example prompts that trigger this skill in your AI assistant.
More by facebook
View all by facebook →You might also like
react-best-practices
redpanda-data
Client-side React performance optimization patterns.
feature-flags
Use when feature flag tests fail, flags need updating, understanding @gate pragmas, debugging channel-specific test failures, or adding new flags to React.
senior-qa
alirezarezvani
This skill should be used when the user asks to "generate tests", "write unit tests", "analyze test coverage", "scaffold E2E tests", "set up Playwright", "configure Jest", "implement testing patterns", or "improve test quality". Use for React/Next.js testing with Jest, React Testing Library, and Playwright.
react-component-performance
Dimillian
Analyze and optimize React component performance issues (slow renders, re-render thrash, laggy lists, expensive computations). Use when asked to profile or improve a React component, reduce re-renders, or speed up UI updates in React apps.
accessibility-compliance
wshobson
Implement WCAG 2.2 compliant interfaces with mobile accessibility, inclusive design patterns, and assistive technology support. Use when auditing accessibility, implementing ARIA patterns, building for screen readers, or ensuring inclusive user experiences.
frontend-testing
langgenius
Generate Vitest + React Testing Library tests for Dify frontend components, hooks, and utilities. Triggers on testing, spec files, coverage, Vitest, RTL, unit tests, integration tests, or write/review test requests.