{"id":29806332,"url":"https://github.com/bartolli/claude-code-typescript-hooks","last_synced_at":"2026-05-31T01:30:28.927Z","repository":{"id":305606519,"uuid":"1023310957","full_name":"bartolli/claude-code-typescript-hooks","owner":"bartolli","description":null,"archived":false,"fork":false,"pushed_at":"2025-08-26T17:11:20.000Z","size":48,"stargazers_count":80,"open_issues_count":0,"forks_count":6,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-08-27T00:01:40.065Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/bartolli.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-07-21T01:02:14.000Z","updated_at":"2025-08-26T20:35:06.000Z","dependencies_parsed_at":"2025-07-21T04:27:18.365Z","dependency_job_id":"13504577-0493-422f-ad33-af9ee68cb482","html_url":"https://github.com/bartolli/claude-code-typescript-hooks","commit_stats":null,"previous_names":["bartolli/claude-code-typescript-hooks"],"tags_count":0,"template":false,"template_full_name":null,"purl":"pkg:github/bartolli/claude-code-typescript-hooks","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bartolli%2Fclaude-code-typescript-hooks","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bartolli%2Fclaude-code-typescript-hooks/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bartolli%2Fclaude-code-typescript-hooks/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bartolli%2Fclaude-code-typescript-hooks/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/bartolli","download_url":"https://codeload.github.com/bartolli/claude-code-typescript-hooks/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/bartolli%2Fclaude-code-typescript-hooks/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":33716338,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-05-30T02:00:06.278Z","response_time":92,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-07-28T14:05:57.493Z","updated_at":"2026-05-31T01:30:28.914Z","avatar_url":"https://github.com/bartolli.png","language":"JavaScript","funding_links":[],"categories":["Hooks 🪝","SDKs \u0026 Development Kits","AI Coding Agents","Other"],"sub_categories":["General","Claude Code"],"readme":"# Claude Code Quality Hooks\n\n![Claude Code](https://img.shields.io/badge/Claude_Code-Compatible-4A90E2?logo=anthropic\u0026logoColor=white)\n![TypeScript](https://img.shields.io/badge/TypeScript-Powered-3178C6?logo=typescript\u0026logoColor=white)\n![Node.js](https://img.shields.io/badge/Node.js-Runtime-339933?logo=node.js\u0026logoColor=white)\n![Hooks](https://img.shields.io/badge/Hooks-PostToolUse-FF6B6B?logo=git\u0026logoColor=white)\n\nQuality checks for different project types.\n\n[Official Documentation](https://docs.anthropic.com/en/docs/claude-code/hooks)\n\n## Quick Start\n\n### 1. Choose Your Project Type\n\n```bash\n# React/Next.js/Vite apps\n.claude/hooks/react-app/\n\n# VS Code extensions\n.claude/hooks/vscode-extension/\n\n# Node.js TypeScript projects\n.claude/hooks/node-typescript/\n\n# More coming soon...\n```\n\n### 2. Configure Claude Code\n\nAdd to `.claude/settings.local.json` and customize \"command\" quality-check.js path according to your project type (react-app, vscode-extension, node-typescript):\n\n```json\n{\n  \"hooks\": {\n    \"PostToolUse\": [\n      {\n        \"matcher\": \"Write|Edit|MultiEdit\",\n        \"hooks\": [\n          {\n            \"type\": \"command\",\n            \"command\": \"node $CLAUDE_PROJECT_DIR/.claude/hooks/react-app/quality-check.js\"\n          }\n        ]\n      }\n    ]\n  }\n}\n```\n\n### 3. Done\n\nHook runs automatically when you edit files.\n\n## Features\n\n- Catches errors before runtime\n- Uses project-specific TypeScript configurations\n- Auto-fixes trivial issues\n- Project-aware rules (React hooks allow console.log, VS Code extensions don't)\n- Immediate feedback during editing\n- Prevents regressions\n\n## Project Types\n\n### React App\n\n- Console allowed in components\n- 'as any' warnings (not errors)\n- JSX support\n\n### VS Code Extension\n\n- Console blocked in extension code\n- Console allowed in webview\n- Strict TypeScript\n\n### Node.js TypeScript\n\n- Console allowed (acceptable for CLI tools)\n- 'as any' warnings (not errors)\n- Optimized for server/client transport code\n\n## Configuration\n\nEach hook has `hook-config.json`:\n\n```json\n{\n  \"typescript\": {\n    \"enabled\": true,\n    \"showDependencyErrors\": false,\n    \"jsx\": \"react\" // For React hooks\n  },\n  \"eslint\": {\n    \"enabled\": true,\n    \"autofix\": true\n  },\n  \"prettier\": {\n    \"enabled\": true,\n    \"autofix\": true\n  },\n  \"rules\": {\n    \"console\": {\n      \"severity\": \"info|warning|error\",\n      \"allowIn\": {\n        \"paths\": [\"src/components/\"],\n        \"fileTypes\": [\"component\", \"test\"]\n      }\n    }\n  }\n}\n```\n\n### Environment Variable Overrides\n\n```bash\n# Disable specific checks\nexport CLAUDE_HOOKS_PRETTIER_ENABLED=false\n\n# Enable debug mode\nexport CLAUDE_HOOKS_DEBUG=true\n\n# Show dependency errors (not recommended)\nexport CLAUDE_HOOKS_SHOW_DEPENDENCY_ERRORS=true\n```\n\n## Testing\n\n```bash\n# Test manually\necho '{\"tool_name\":\"Edit\",\"tool_input\":{\"file_path\":\"src/App.tsx\"}}' | node .claude/hooks/react-app/quality-check.js\n\n# Run with debug output\nexport CLAUDE_HOOKS_DEBUG=true\necho '{\"tool_name\":\"Edit\",\"tool_input\":{\"file_path\":\"src/App.tsx\"}}' | node .claude/hooks/react-app/quality-check.js\n```\n\n## Creating New Hooks\n\n1. Copy existing hook folder\n2. Edit `hook-config.json`\n3. Customize rules as needed\n\n## Exit Codes\n\n- **Exit 0**: All checks passed\n  - File quality verified\n  - Auto-fixes applied if enabled\n  - Hook output suppressed by Claude Code\n\n- **Exit 2**: Issues found\n  - TypeScript compilation errors\n  - ESLint errors that couldn't be auto-fixed\n  - Prettier issues (if auto-fix disabled)\n  - Full error report shown to agent\n\nWhen running via Claude Code hooks:\n- **Exit 0**: Silent success (no output shown)\n- **Exit 2**: Full error report shown to user\n\nWhen testing manually:\n- All `[INFO]`, `[OK]`, `[WARN]` messages visible\n- Useful for debugging hook behavior\n\n## Under the Hook\n\n### Hook Flow\n\n```mermaid\ngraph TD\n    A[File Edit Detected] --\u003e B[Hook Triggered]\n    B --\u003e C{Parse Tool Input}\n    C --\u003e D[Extract File Path]\n    D --\u003e E[Load Configuration]\n    E --\u003e F[Smart Cache Check]\n    F --\u003e G{Config Changed?}\n    G --\u003e|Yes| H[Rebuild TS Mappings]\n    G --\u003e|No| I[Use Cached Mappings]\n    H --\u003e J[Run Quality Checks]\n    I --\u003e J\n    J --\u003e K[TypeScript Check]\n    J --\u003e L[ESLint Check]\n    J --\u003e M[Prettier Check]\n    J --\u003e N[Common Issues Check]\n    K --\u003e O{Has Errors?}\n    L --\u003e O\n    M --\u003e O\n    N --\u003e O\n    O --\u003e|Yes| P[Exit Code 2 - Block]\n    O --\u003e|No| Q[Exit Code 0 - Pass]\n```\n\n### Smart TypeScript Config Cache\n\nThe hook uses a caching system to handle complex TypeScript configurations:\n\n**1. Config Discovery**\n\n- Finds all `tsconfig*.json` files in your project\n- Sorts by specificity (specific configs like `tsconfig.webview.json` take precedence)\n- Builds a mapping of file patterns to configs\n\n**2. SHA256 Change Detection**\n\n```javascript\n// Each config file gets a SHA256 hash\nconst hash = crypto.createHash('sha256').update(configFileContent).digest('hex');\n```\n\nThis creates a unique fingerprint for each config:\n\n- `tsconfig.json`: `c70342f6265640de2ba06a522870b4dc...`\n- `tsconfig.webview.json`: `55e05e47dc57fbdab2a2d30704f9ab1f...`\n\n**3. Cache Structure**\n\n```json\n{\n  \"hashes\": {\n    \"tsconfig.json\": \"c70342f6265640de2ba06a522870b4dc1a4737818abe862c41108014cf442735\",\n    \"tsconfig.webview.json\": \"55e05e47dc57fbdab2a2d30704f9ab1f6d9f312ee7c14e83b7a3613e73b4a230\"\n  },\n  \"mappings\": {\n    \"src/webview/**/*\": {\n      \"configPath\": \"tsconfig.webview.json\",\n      \"excludes\": [\"node_modules\", \"test\"]\n    },\n    \"src/protocol/**/*\": {\n      \"configPath\": \"tsconfig.webview.json\",\n      \"excludes\": [\"node_modules\", \"test\"]\n    },\n    \"src/**/*\": {\n      \"configPath\": \"tsconfig.test.json\",\n      \"excludes\": [\"node_modules\", \"gui\"]\n    }\n  }\n}\n```\n\n**4. Cache Lifecycle**\n\n```mermaid\ngraph LR\n    A[Hook Starts] --\u003e B{Cache Exists?}\n    B --\u003e|No| C[Build Cache]\n    B --\u003e|Yes| D[Load Cache]\n    D --\u003e E{Verify SHA256 Hashes}\n    E --\u003e|Changed| F[Rebuild Affected Mappings]\n    E --\u003e|Same| G[Use Cached Mappings]\n    F --\u003e H[Update Cache File]\n    C --\u003e H\n    G --\u003e I[Run Checks]\n    H --\u003e I\n```\n\n**5. Performance \u0026 Benefits**\n\n- First run: ~100-200ms to build cache\n- Subsequent runs: \u003c5ms to verify hashes using SHA256\n- Config change: Only rebuilds affected mappings\n- Result: 95%+ faster on repeated runs\n- SHA256 ensures cache validity (cryptographically secure, collision resistant)\n- Each hook maintains its own cache\n- Skip expensive file system operations\n\n**Why manual hashing vs TypeScript project references?**\n\nManual SHA256 hashing provides \u003c5ms cache lookups compared to 100-500ms for `tsc` incremental checks. The cache maintains reference maps to actual config paths while delivering superior performance for real-time editing scenarios.\n\n### Check Execution\n\n**1. TypeScript Compilation**\n\n- Uses the correct config for the edited file\n- Only shows errors for the edited file (not dependencies)\n- Respects JSX settings from config\n\n**2. ESLint Integration**\n\n- Auto-fixes issues when possible\n- Re-runs after fixes to verify\n- Respects project ESLint config\n\n**3. Prettier Formatting**\n\n- Auto-formats on save\n- Silent when successful\n- Uses project Prettier config\n\n**4. Common Issues Detection**\n\n- Console usage (configurable per project type)\n- `as any` usage (error vs warning)\n- TODO/FIXME comments (informational)\n\n### Troubleshooting\n\n**Cache issues?**\n\n```bash\n# Clear the hook's cache\nrm .claude/hooks/react-app/tsconfig-cache.json\n```\n\n\n**Hook not running?**\n\n```bash\n# Check if executable\nchmod +x .claude/hooks/*/quality-check.js\n```\n\n## Questions\n\nCheck individual hook folders for more details.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbartolli%2Fclaude-code-typescript-hooks","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fbartolli%2Fclaude-code-typescript-hooks","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fbartolli%2Fclaude-code-typescript-hooks/lists"}