setup-pre-commit

Compare original and translation side by side

🇺🇸

Original

English

🇨🇳

Translation

Chinese

Setup Pre-Commit Hooks

配置预提交钩子

What This Sets Up

配置内容

Husky pre-commit hook
lint-staged running Prettier on all staged files
Prettier config (if missing)
typecheck and test scripts in the pre-commit hook

Husky 预提交钩子
lint-staged 对所有暂存文件执行Prettier格式化
Prettier 配置文件（若不存在则创建）
预提交钩子中加入typecheck和test脚本

Steps

步骤

1. Detect package manager

1. 检测包管理器

Check for

package-lock.json

(npm),

pnpm-lock.yaml

(pnpm),

yarn.lock

(yarn),

bun.lockb

(bun). Use whichever is present. Default to npm if unclear.

检查是否存在

package-lock.json

（npm）、

pnpm-lock.yaml

（pnpm）、

yarn.lock

（yarn）或

bun.lockb

（bun）。使用已存在的包管理器，若无法确定则默认使用npm。

2. Install dependencies

2. 安装依赖

Install as devDependencies:

husky lint-staged prettier

作为开发依赖安装：

husky lint-staged prettier

3. Initialize Husky

3. 初始化Husky

bash

npx husky init

This creates

.husky/

dir and adds

prepare: "husky"

to package.json.

bash

npx husky init

此命令会创建

.husky/

目录，并在package.json中添加

prepare: "husky"

脚本。

4. Create

.husky/pre-commit

4. 创建

.husky/pre-commit

文件

Write this file (no shebang needed for Husky v9+):

npx lint-staged
npm run typecheck
npm run test

Adapt: Replace

npm

with detected package manager. If repo has no

typecheck

test

script in package.json, omit those lines and tell the user.

写入以下内容（Husky v9+不需要添加shebang）：

npx lint-staged
npm run typecheck
npm run test

适配说明：将

npm

替换为检测到的包管理器。如果仓库的package.json中没有

typecheck

或

test

脚本，则省略对应行并告知用户。

5. Create

.lintstagedrc

5. 创建

.lintstagedrc

文件

json

{
  "*": "prettier --ignore-unknown --write"
}

json

{
  "*": "prettier --ignore-unknown --write"
}

6. Create

.prettierrc

(if missing)

6. 创建

.prettierrc

文件（若不存在）

Only create if no Prettier config exists. Use these defaults:

json

{
  "useTabs": false,
  "tabWidth": 2,
  "printWidth": 80,
  "singleQuote": false,
  "trailingComma": "es5",
  "semi": true,
  "arrowParens": "always"
}

仅当Prettier配置不存在时创建，使用以下默认配置：

json

{
  "useTabs": false,
  "tabWidth": 2,
  "printWidth": 80,
  "singleQuote": false,
  "trailingComma": "es5",
  "semi": true,
  "arrowParens": "always"
}

7. Verify

7. 验证

```
.husky/pre-commit
```
exists and is executable
```
.lintstagedrc
```
exists
```
prepare
```
script in package.json is
```
"husky"
```
```
prettier
```
config exists
Run
```
npx lint-staged
```
to verify it works

确认
```
.husky/pre-commit
```
文件存在且可执行
确认
```
.lintstagedrc
```
文件存在
确认package.json中的
```
prepare
```
脚本为
```
"husky"
```
确认Prettier配置文件存在
执行
```
npx lint-staged
```
验证功能正常

8. Commit

8. 提交代码

Stage all changed/created files and commit with message:

Add pre-commit hooks (husky + lint-staged + prettier)

This will run through the new pre-commit hooks — a good smoke test that everything works.

将所有修改/创建的文件加入暂存区，并使用提交信息：

Add pre-commit hooks (husky + lint-staged + prettier)

此提交会触发新配置的预提交钩子，是验证所有功能正常的良好冒烟测试。

Notes

注意事项

Husky v9+ doesn't need shebangs in hook files
```
prettier --ignore-unknown
```
skips files Prettier can't parse (images, etc.)
The pre-commit runs lint-staged first (fast, staged-only), then full typecheck and tests

Husky v9+不需要在钩子文件中添加shebang
```
prettier --ignore-unknown
```
会跳过Prettier无法解析的文件（如图片等）
预提交钩子会先执行lint-staged（速度快，仅处理暂存文件），再执行完整的类型检查和测试

setup-pre-commit

Original

Translation

Setup Pre-Commit Hooks

配置预提交钩子

What This Sets Up

配置内容

Steps

步骤

1. Detect package manager

1. 检测包管理器

2. Install dependencies

2. 安装依赖

3. Initialize Husky

3. 初始化Husky

4. Create
`.husky/pre-commit`

4. 创建
`.husky/pre-commit`
文件

5. Create
`.lintstagedrc`

5. 创建
`.lintstagedrc`
文件

6. Create
`.prettierrc`
(if missing)

6. 创建
`.prettierrc`
文件（若不存在）

7. Verify

7. 验证

8. Commit

8. 提交代码

Notes

注意事项

setup-pre-commit

Original

Translation

Setup Pre-Commit Hooks

配置预提交钩子

What This Sets Up

配置内容

Steps

步骤

1. Detect package manager

1. 检测包管理器

2. Install dependencies

2. 安装依赖

3. Initialize Husky

3. 初始化Husky

4. Create .husky/pre-commit

4. 创建.husky/pre-commit文件

5. Create .lintstagedrc

5. 创建.lintstagedrc文件

6. Create .prettierrc (if missing)

6. 创建.prettierrc文件（若不存在）

7. Verify

7. 验证

8. Commit

8. 提交代码

Notes

注意事项

4. Create
`.husky/pre-commit`

4. 创建
`.husky/pre-commit`
文件

5. Create
`.lintstagedrc`

5. 创建
`.lintstagedrc`
文件

6. Create
`.prettierrc`
(if missing)

6. 创建
`.prettierrc`
文件（若不存在）