Husky 实践：如何在提交时进行代码校验和提交校验

前言

代码校验和提交校验在多人协作时，对项目有什么样的意义呢？

在多人协作时，代码校验和提交校验对项目的意义是非常重要的。这意味着团队成员可以通过对代码进行校验和规范性提交来确保代码质量和一致性。以下是一些具体的意义：

• 在多人协作项目中，代码风格统一、代码提交信息的说明准确，那么在后期协作以及Bug处理时会更加方便。[1]
• 代码校验和提交校验可以防止代码中的语法错误和代码风格不一致，这有助于确保代码的可读性和可维护性。[0]
• 代码校验和提交校验可以确保代码符合一定的标准和规范，从而提高了代码的质量和可靠性。[4]
• 通过代码校验和提交校验，团队成员可以更好地理解彼此的代码，从而更好地协作和交流。[3]

对于代码校验和提交校验，有多种方法可以实现，以下是一些常见的方法及其优缺点：

• 使用 Git Hooks 和 Husky：Husky是一个Git钩子工具，可以在提交之前帮你做一些事情。Git Hooks是Git的钩子程序，可以在Git命令执行前或执行后运行自定义的脚本。这种方法的优点是可以在本地进行代码校验和提交校验，不需要连接到远程服务器。但是，如果团队成员不使用Git，这种方法就无法实现。[2]
• 使用 Lint 工具：Lint工具是一种静态代码分析工具，可以扫描代码中的错误和不良实践。这种方法的优点是可以在任何代码编辑器中使用，并且可以根据团队的需要配置自定义规则。但是，这种方法只能进行代码校验，不能进行提交校验。[4]
• 使用 Commitizen 工具：Commitizen是一个撰写合格的Commit message的工具。可以使用Git cz代替Git commit，出现选项，用来生成符合格式的Commit message。这种方法的优点是可以确保提交信息的准确性和一致性，但是不能进行代码校验。[3]

综上所述，代码校验和提交校验在多人协作时非常重要。可以通过多种方法实现，每种方法都有其优点和缺点。团队应该根据自己的需要和情况选择合适的方法。

以上来之 Phind 的 AI 回答，总之对于多人协作就是相当重要

安装 husky、lint-staged及commitlint

husky 的作用

简化 git hooks 的创建和修改。在初始化时，husky 会先检查该项目是否通过 git 来托管代码，如果是，就会创建 .husky 文件夹用来存放 git hooks 和 husky 的配置。

pnpm install husky lint-staged -D

pnpm add @commitlint/cli @commitlint/config-conventional -D

lint-staged

Lint-staged 是一个用于在 git 提交代码之前，对暂存区的代码执行一系列的格式化的工具，可以在提交代码之前，对即将提交的代码进行格式化，成功之后就会提交代码。当 Lint-staged 配合 git hooks 使用时，可以在 git 提交前的 hook 中加入 Lint-staged 命令。

commitlint

commitlint 是一个用于校验 Git Commit Message 是否符合规范的工具。其可以与 husky 结合使用，以便在进行 commit 操作时自动校验 commit message 的格式是否符合团队约定的规范。

在package.json中手动更新脚本

// package.json 
{
    "scripts": {
        "prepare": "husky install",
        "lint:style": "stylelint 'src/**/*.scss' --syntax scss",
        "lint:format": "eslint --ext .js,.ts,.tsx ./",
    }, 
    "devDependencies": {
        "husky": "^8.0.1",
        "lint-staged": ">=10",
        "@commitlint/cli": "^11.0.0",
        "@commitlint/config-conventional": "^11.0.0",
    },
    "lint-staged": {
        "**/*.scss": "npm run lint:style",
        "src/**/*.{js,ts,tsx,json}": [
            "npm run lint"
        ]
    }
}

创建git-hooks钩子

husky add .husky/commit-msg "npx --no -- commitlint --edit ${1}"

husky add .husky/pre-commit "npx lint-staged"

或者你可以把脚本更新在你的项目package.json中

    "scripts": {
        "create-hook": "husky add .husky/commit-msg \"npx --no -- commitlint --edit ${1}\" && husky add .husky/pre-commit \"npx lint-staged\""
    }

然后运行npm run create-hook，就可以便捷的给你的项目创建git-hooks

提交验证

在我们提交commit时，就会进行校验，不符合规范或者代码风格不符合规范时，就会在terminal进行提示