GSA / GSA/sam-styles

tooling: add pre-commit hook for Prettier format-check on staged files

Open
#758 0 comments 0 reactions 0 assignees View on GitHub
build chore tooling
Dominant language
HTML
Stars
7
Forks
11
Avg merge
18h 3m
Merged PRs (30d)
14

Description

## Problem

Prettier formatting drift on staged files goes undetected locally and only surfaces in the CI `Format-Check` step. This causes avoidable CI failures on otherwise-correct commits (most recently #755).

## Proposed solution

Add a pre-commit hook that runs Prettier only on **staged files** using [lint-staged](https://github.com/lint-staged/lint-staged) + [Husky](https://typicode.github.io/husky/).

This keeps the hook fast (ms per file, not seconds across the whole repo) and catches format issues before they ever reach CI.

### Suggested implementation

```bash
npm install --save-dev husky lint-staged
npx husky init
```

``.husky/pre-commit``
```bash
npx lint-staged
```

``package.json`` addition:
```json
"lint-staged": {
"**/*.{scss,css,js,json,md}": "prettier --check"
}
```

## Scope

- **In scope:** Prettier format-check on staged files only
- **Out of scope:** Running full `npm run lint` (stylelint across all SCSS) or `build:storybook` in the pre-commit hook — both are too slow for interactive use

## Acceptance criteria

- [ ] `husky` and `lint-staged` added as devDependencies
- [ ] `npx husky init` sets up `.husky/pre-commit`
- [ ] `lint-staged` config in `package.json` runs `prettier --check` on staged `.scss`, `.css`, `.js`, `.json`, and `.md` files
- [ ] Committing a Prettier-dirty file is blocked with a clear error message
- [ ] `npm run lint` and `npm run compile:check` still pass
- [ ] `prepare` script added so `npm install` auto-installs the hook for new contributors

## Related

- #755 (the CI failure that prompted this)
- #739 (Prettier was added to the repo)

Contributor guide

Open the contributing guide

Research direction

Start with package.json and the repository's existing Format-Check, lint, and compile:check scripts, then review the proposed .husky/pre-commit file. Add the Husky and lint-staged setup described in the issue, verify that only staged SCSS, CSS, JavaScript, JSON, and Markdown files are checked, and confirm dirty commits are blocked while the listed npm checks still pass.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
tooling
Issue type
Feature
Difficulty
3/5
Estimated time
1-2 days
Activity status
Quiet
Clarity
Clearly specified
Newbie friendliness
76/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.