Hooki Claude Code jako CI light: lint, astro check, testy i Lighthouse
Budujemy zestaw hooków PostToolUse i Stop, które po każdej zmianie formatują kod, uruchamiają testy, generują coverage oraz raport dostępności.
1. Pomysł na CI light
Zamiast czekać na pipeline serwerowy, możesz użyć hooków Claude Code, by natychmiast po każdej edycji uzyskać:
- formatowanie (
prettier), npm run astro check,npm run test -- --coverage,- Lighthouse CI (
lhci autorun), - podsumowanie na końcu sesji.
2. Hook PostToolUse
W pliku .claude/settings.json zdefiniuj:
{
"hooks": {
"PostToolUse": [
{
"matcher": "Write|Edit",
"hooks": [
{
"type": "command",
"command": "npx prettier --write \"$TOOL_INPUT_file_path\"",
"timeout": 30
},
{
"type": "command",
"command": "npm run astro check",
"timeout": 120
},
{
"type": "command",
"command": "npm run test -- --coverage",
"timeout": 300
},
{
"type": "command",
"command": "npx lhci autorun --upload.target=temporary-public-storage",
"timeout": 420
}
]
}
]
}
}
Hooki wykonują się równolegle. W razie błędu Claude pokaże logi (lint, testy, Lighthouse). Warto przekierować „głośne” wyjście do plików log:
{
"command": "npm run test -- --coverage > .claude/logs/tests.log",
"timeout": 300
}
3. Hook Stop – podsumowanie
Dodaj raport na zakończenie sesji:
{
"hooks": {
"Stop": [
{
"matcher": "*",
"hooks": [
{
"type": "command",
"command": "tail -n 20 .claude/logs/tests.log && tail -n 20 .lighthouseci/cli-latest-run.json",
"timeout": 30
}
]
}
]
}
}
Stop uruchamia się, gdy główny agent kończy odpowiedź – idealny moment na syntetyczne podsumowanie.
4. Walidacja bezpieczeństwa
Aby uniknąć zmian w wrażliwych plikach:
{
"type": "command",
"command": "if echo \"$TOOL_INPUT_file_path\" | grep -q '\\.env'; then echo 'Blocked secret file' >&2 && exit 2; fi",
"timeout": 5
}
exit 2 blokuje dalszy ciąg operacji i wyświetla komunikat w sesji.
5. Workflow pracy
- Plan Mode – zaplanuj zadania (np. refaktoring).
- Wyjdź z Plan Mode – wydaj polecenie wprowadzające zmiany.
- Hook PostToolUse – automatycznie formatowanie, lint, testy i Lighthouse.
- Manual review – agent prezentuje logi, Ty decydujesz.
- Stop hook – sesja kończy się raportem z testów i audytu dostępności.
6. Rady praktyczne
- Przekieruj logi do katalogu
.claude/logs/– łatwo się do nich odwołać w konwersacji. - Limituj timeouty –
lhci autorunmoże trwać dłużej; dostosuj w zależności od projektu. - Dodaj guardraile – np.
npm run test -- --coveragetylko, gdy zmieniono pliki.test.ts. - Sync z CI – w docelowym pipeline korzystaj z tych samych komend, aby uniknąć rozjazdów.
Taki zestaw hooków zamienia Claude Code w narzędzie Continuous Integration light – masz natychmiastowy feedback jakościowy bez opuszczania sesji AI.
📚 Dokumentacja i Zasoby
Oficjalna Dokumentacja
Powiązane Artykuły
Podobał Ci się ten tutorial?
Podziel się nim ze znajomymi i kolegami, którym może się przydać!
📚 Powiązane Artykuły
AI w pipeline frontendu: Plan Mode + hook PostToolUse dla pełnej automatyzacji
Jak skonfigurować Claude Code, by po zmianach komponentów AI planował zadania, formatował kod, uruchamiał astro check oraz wskazywał brakujące testy.
Power-user workflow: Extended Thinking Megathink, Sessions i approvals
Przewodnik dla zaawansowanych użytkowników Claude Code: jak łączyć najdłuższe tryby myślenia, zapisy stanu i mechanizm approvals w złożonych projektach.
Autonomiczne analizy kodu z Claude Code: Plan Mode, Extended Thinking i hooki
Jak połączyć tryb tylko-do-odczytu, głębokie myślenie oraz hook PostToolUse, by agent AI zaplanował refaktoring, zrealizował go etapowo i zebrał metryki testów.