如何将 lint-stage 与 Husky 集成？

Question

我的package.json（简化版）

  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "tsc": "tsc",
    "type-check": "tsc --project tsconfig.json --pretty --noEmit",
    "lint": "eslint --ext js,jsx,ts,tsx --fix"
  },
  "dependencies": {
    "@types/node": "^14.14.25",
    "@types/react": "^17.0.1",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-react-hooks": "^4.2.0",
    "next": "^10.0.6",
    "react": "^17.0.1",
    "react-dom": "^17.0.1",
    "typescript": "^4.1.4"
  },  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.{js,jsx,ts,tsx}": "eslint --cache --fix"
  }

我用 npm（不是 yarn）安装了所有东西。当我添加空文件并提交时

git commit -m "test"
[main ca9db77] test
 1 file changed, 4 insertions(+)
 create mode 100644 pages/test.tsx

没有 lint-staging，所以 husky 是不可见的。如何解决这个问题？

Answer 1

你必须安装 husky 作为 DevDependencies

然后用 husky install 创建一个 prepare 脚本：

"scripts": {
    "dev": "next dev",
    "build": "cross-env NODE_ENV=production next build",
    "start": "next start",
    "lint": "eslint src --max-warnings=0",
    "typecheck": "tsc --project tsconfig.json --pretty --noEmit",
    "test": "jest",
    "test:watch": "yarn test --watch",
    "prepare": "husky install"
  }

和运行一次：npm run prepare

然后，添加一个钩子： npx husky add .husky/pre-commit "npm test"

打开.husky\pre-commit

并添加npx --no-install lint-staged

您的文件应如下所示：

#!/bin/sh
. "$(dirname "[=11=]")/_/husky.sh"

npx --no-install lint-staged

在 package.json 上创建 lint-staged 密钥，就像您所做的那样。

"lint-staged": {
    "src/**/*": [
      "yarn lint --fix",
      "tsc-files --noEmit --pretty",
      "yarn test --findRelatedTests --bail"
    ]
  },

如何将 lint-stage 与 Husky 集成？

How to integrate lint-stage with Husky?

git

typescript

husky