react-doctor

Scans React codebases for security, performance, and architecture issues with a health score.

3|Updated Apr 20, 2026
One-click install
npx skills add https://github.com/langgenius/due-date-hq-jwl --skill react-doctor-langgenius
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: react-doctor
Source: https://github.com/langgenius/due-date-hq-jwl/tree/main/.claude/skills/react-doctor
Command: npx skills add https://github.com/langgenius/due-date-hq-jwl --skill react-doctor-langgenius

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires react-doctor, and includes references (resource) components.

What problem does it solve? React codebases accumulate lint violations, accessibility gaps, bundle bloat, and architecture problems that are hard to triage manually. This Skill runs automated diagnostics, scores code health from 0-100, and guides fixes by severity so regressions are caught before committing. ## Core Features & Use Cases - Regression checks after code changes: Run a changed-scope scan to verify the health score did not drop before committing React code. - Full codebase triage: Execute a full scan that reports errors and warnings with affected files and line numbers, then fix issues by severity. - Focused UI design audits: Run design-tagged diagnostics covering UI composition, typography, interaction, accessibility, and motion rules. - Rule explanation and configuration: Explain why a rule fired and disable, re-severity, or ignore rules via edits to doctor.config or package.json. - Use Case: After refactoring a component, ask the assistant to run react-doctor on changed files; if the score dropped, follow the fetched triage playbook to fix regressions before committing. ## Quick Start Ask the assistant to run react-doctor on the changed files in this project and fix any regressions it reports.

Frequently Asked Questions about react-doctor

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scan a React codebase for lint and accessibility issues?

Run npx react-doctor@latest --verbose to scan the full codebase. It reports security, performance, correctness, and architecture issues with affected files and line numbers, plus a 0-100 health score.

How do I check React code changes before committing?

Run npx react-doctor@latest --verbose --scope changed after making edits. This reports only issues introduced versus the base branch, so you can fix regressions if the health score dropped before committing.

How do I disable or configure a React Doctor rule?

Use npx react-doctor@latest rules explain <rule> to understand it, then apply the narrowest control: rules disable, rules set to warn or error, rules category off, or rules ignore-tag. These commands edit doctor.config or the reactDoctor key in package.json.

Can I run only accessibility and UI design checks?

Yes, run npx react-doctor@latest design --verbose. This selects only design-tagged rules covering UI composition, typography, interaction, accessibility, and motion, including focused rules that stay opt-in during a general scan.

Why does a disabled rule still not run after I set it to warn?

Tag-based ignores take precedence: ignore.tags disables every rule carrying that tag before linting, so a rule-level override cannot re-enable a tag-ignored rule. Remove the tag with rules unignore-tag first.