lint-staged 使用教程

lint-staged 使用教程

lint-staged🚫💩 — Run linters on git staged files项目地址:https://gitcode.com/gh_mirrors/li/lint-staged

1. 项目介绍

lint-staged 是一个非常实用的工具，它可以让你在 Git 的暂存区(staging area)里的文件上运行指定的代码质量检查器(linters)。这个项目的意义在于避免在提交时对未修改的文件进行不必要的 lint 检查。如果你希望只针对变动过的文件进行检查，那么 lint-staged 就是你的理想选择。

2. 项目快速启动

安装

首先，确保你已经安装了 Git 和 Node.js。然后，在你的项目根目录下，通过以下命令安装 lint-staged 和 husky：

npm install --save-dev lint-staged husky

配置

接下来，你需要在 package.json 文件中配置 lint-staged，比如使用 Prettier 和 ESLint：

{
  "scripts": {
    "precommit": "lint-staged"
  },
  "lint-staged": {
    "*.js": [
      "eslint --fix",
      "prettier --write"
    ]
  }
}

这里我们设置了 precommit 哥斯拉，让 lint-staged 在每次提交前自动运行。

测试

现在，你可以测试配置是否成功。修改一个 .js 文件，然后将其添加到暂存区：

git add your-file.js
git commit -m "Test lint-staged"

如果一切正常，你应该能看到 eslint 和 prettier 在运行，并且自动修复了文件格式问题。

3. 应用案例和最佳实践

案例：自定义配置

你可以在 lint-staged 配置中使用不同的 glob 模式来匹配不同类型的文件，例如：

{
  "lint-staged": {
    "*.ts": ["ts-lint"],
    "*.vue": ["vue-cli-service lint"]
  }
}

最佳实践

• 只对特定的文件类型应用 linter，避免无效检查。
• 使用 --no-verify 选项临时跳过 husky 中的钩子，以便快速提交而不触发 lint-staged。
• 对于复杂场景，考虑使用条件语句或外部脚本来实现更复杂的逻辑。

4. 典型生态项目

• Husky: 一个管理 Git 钩子(hooks)的库，通常与 lint-staged 结合使用，保证在提交前运行 linters。
• ESLint: 一个流行的 JavaScript 代码质量检测工具。
• Prettier: 代码格式化工具，帮助统一代码风格。
• Stylelint: CSS 代码检查器，适用于 CSS、Less、Sass 等。
• TSLint: TypeScript 的 linter，现已废弃，推荐使用 ESLint + typescript-eslint 插件。

以上就是关于 lint-staged 的简单教程，希望对你有所帮助。记得持续关注项目官方仓库，获取最新的更新和资讯。

lint-staged🚫💩 — Run linters on git staged files项目地址:https://gitcode.com/gh_mirrors/li/lint-staged