TypeScript Quality Hooks

Claude Code Quality Hooks

Quality checks for different project types.

Official Documentation

Quick Start

1. Choose Your Project Type

2. Configure Claude Code

Add to .claude/settings.local.json and customize "command" quality-check.js path according to your project type (react-app, vscode-extension, node-typescript):

3. Done

Hook runs automatically when you edit files.

Features

- Catches errors before runtime
- Uses project-specific TypeScript configurations
- Auto-fixes trivial issues
- Project-aware rules (React hooks allow console.log, VS Code extensions don't)
- Immediate feedback during editing
- Prevents regressions

Project Types

React App

- Console allowed in components
- 'as any' warnings (not errors)
- JSX support

VS Code Extension

- Console blocked in extension code
- Console allowed in webview
- Strict TypeScript

Node.js TypeScript

- Console allowed (acceptable for CLI tools)
- 'as any' warnings (not errors)
- Optimized for server/client transport code

Configuration

Each hook has hook-config.json:

Environment Variable Overrides

Testing

Creating New Hooks

1. Copy existing hook folder
2. Edit hook-config.json
3. Customize rules as needed

Exit Codes

- Exit 0: All checks passed
  - File quality verified
  - Auto-fixes applied if enabled
  - Hook output suppressed by Claude Code

- Exit 2: Issues found
  - TypeScript compilation errors
  - ESLint errors that couldn't be auto-fixed
  - Prettier issues (if auto-fix disabled)
  - Full error report shown to agent

When running via Claude Code hooks:
- Exit 0: Silent success (no output shown)
- Exit 2: Full error report shown to user

When testing manually:
- All [INFO], [OK], [WARN] messages visible
- Useful for debugging hook behavior

Under the Hook

Hook Flow

Smart TypeScript Config…