メニュー
Run React build, lint, type-check, and test validation. Use after modifying React components, hooks, or configuration. Catches TypeScript errors, Tailwind issues, and build failures before commit.
Codex または Claude でインストール この Prompt をコピーして Codex、Claude、または他のアシスタントに貼り付けると、Skill ページを確認してインストールできます。
SOC 職業分類に基づく
Hard-learned development rules by domain — Python, FastAPI, React, Testing. Prevents the specific mistakes that caused 70+ audit findings across v0.21.0-v0.21.3.
Mandatory pre-merge quality checks for production code — security scan, packaging test, API consistency, no silent failures. Prevents the issues that caused 4 emergency releases in v0.21.x.
Pre-release validation — packaging verification, user acceptance testing, security scan, API drift detection. Prevents the recurring pattern of shipping broken wheels and missing files.
Test the library from an end-user perspective — pip install, import, run all workflows. Catches packaging, import, and API issues that internal tests miss.
Discover exact API function signatures, parameter names, and types from structural_lib. Use BEFORE wrapping or calling any API function. Prevents the #1 agent mistake: guessing parameter names (b_mm not width, fck not concrete_grade).
Run a structured innovation research cycle — discover gaps, propose novel capabilities, prototype and validate breakthrough ideas for structural engineering.
| name | react-validation |
| description | Run React build, lint, type-check, and test validation. Use after modifying React components, hooks, or configuration. Catches TypeScript errors, Tailwind issues, and build failures before commit. |
| argument-hint | Optional: 'build' | 'lint' | 'types' | 'test' | 'all' (default: all) |
Validate React frontend code quality — build, lint, type-check, and test.
react_app/src/npm run build fails and you need diagnosticscd react_app && npm run build
Build includes TypeScript compilation — catches both type errors and import issues.
cd react_app && npx tsc --noEmit
cd react_app && npx eslint src/ --max-warnings 0
cd react_app && npx vitest run
cd react_app && npm run dev
# Opens at http://localhost:5173
Run these in order before committing frontend changes:
cd react_app && npm run buildls react_app/src/hooks/ — verify you didn't recreate an existing hookfind react_app/src -name "*.css" ! -name "index.css" — should return nothing| Error | Cause | Fix |
|---|---|---|
TS2307: Cannot find module | Wrong import path | Check if file was moved — use relative paths |
TS2339: Property does not exist | Wrong type or missing field | Check TypeScript types in types/ |
TS2345: Argument not assignable | Type mismatch in hook/component | Verify Pydantic model matches TS type |
Module not found | Missing dependency | cd react_app && npm install <pkg> |
| Tailwind class not applied | Typo in class name | Check Tailwind docs for correct utility name |
Before creating a new hook, check:
ls react_app/src/hooks/
21 hooks across 11 files already exist. See frontend.agent.md for the full list.
Before creating a new component, check:
ls react_app/src/components/
ls react_app/src/components/design/
ls react_app/src/components/import/
ls react_app/src/components/viewport/
ls react_app/src/components/ui/