저장 시 자동 포맷

Post-Tool입문Hook 타입: post-tool-use

저장 시 자동 포맷은 Write 또는 Edit 도구가 호출될 때마다 해당 파일에 Prettier를 실행합니다. 이를 통해 Claude가 생성하는 모든 코드가 프로젝트의 포맷 규칙에 맞게 정리되며, Claude가 포맷을 기억할 필요가 없습니다. .prettierrc 및 .prettierignore 설정을 준수하며 TypeScript, JavaScript, JSON, CSS, Markdown 등 지원되는 파일 형식을 처리합니다. 성공 시 조용히 실행되며 포맷 변경이 적용된 경우에만 결과를 보고합니다.

Prettier포맷팅코드 스타일자동화

Hook 코드

#!/bin/bash
# Auto-Format on Save Hook
# Runs Prettier after file writes/edits

# Only trigger on Write or Edit
if [[ "$TOOL_NAME" != "Edit" ]] && [[ "$TOOL_NAME" != "Write" ]]; then
  exit 0
fi

FILE_PATH=$(echo "$TOOL_INPUT" | jq -r '.file_path // .path // empty')

if [ -z "$FILE_PATH" ] || [ ! -f "$FILE_PATH" ]; then
  exit 0
fi

# Check if file type is supported by Prettier
if ! echo "$FILE_PATH" | grep -qE '\.(ts|tsx|js|jsx|json|css|scss|md|yaml|yml|html|vue|svelte)$'; then
  exit 0
fi

# Check if prettier is available
if ! command -v npx &>/dev/null; then
  exit 0
fi

# Run Prettier with project config
BEFORE_HASH=$(md5sum "$FILE_PATH" 2>/dev/null | cut -d' ' -f1)
npx prettier --write "$FILE_PATH" 2>/dev/null
AFTER_HASH=$(md5sum "$FILE_PATH" 2>/dev/null | cut -d' ' -f1)

if [ "$BEFORE_HASH" != "$AFTER_HASH" ]; then
  echo "Formatted: $FILE_PATH"
fi

exit 0

이 Hook을 Claude Code 설정 또는 .claude/settings.json에 추가하면 활성화됩니다.

실행 미리보기

저장 시 자동 포맷

저장 시 자동 포맷에 대해

Claude Code Hooks는 Claude 작업 중 특정 이벤트에 반응하여 커스텀 셸 명령을 자동으로 실행합니다. 저장 시 자동 포맷은(는) 입문 수준의 Post-Tool Hook으로, 개발 워크플로우의 핵심 시점에서 작업을 자동화하여 수동 단계를 줄이고 팀 전체의 일관성을 유지합니다.

저장 시 자동 포맷

Hook 코드

실행 미리보기

저장 시 자동 포맷에 대해

관련 Hooks