husky tslint 限制git上传

为什么要限制上传，大家都懂，直接上干货(请确保项目中有 tslint 依赖)

1、限制git上传

下载依赖 husky lint-staged

npm install husky --save-dev
npm install lint-staged --save-dev

package.json 配置

配置lint-staged 检查规则和husky的books

{
  "devDependencies": {
    "husky": "^4.3.0",
    "lint-staged": "^10.5.1",
    "tslint": "^6.1.3",
    "typescript": "^4.0.5"
  },
  "lint-staged": {
    "src/**/*.{js,ts,tsx}": [
      "tslint --project tsconfig.json",
      "git add ."
    ]
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  }
}

配置完成后可尝试提交，如果项目中有错误是不能add的

2、代码风格控制

如果想要在tslint检查前，对项目做整体的风格控制可下载依赖prettier

npm install prettier --save-dev

项目目录下创建文件.prettierrc.js

// .prettierrc.js

module.exports = {
    printWidth: 80,
    semi: false, // 在每个语句的末尾添加分号
    singleQuote: false, // 使用单引号而不是双引号
    trailingComma: "none", // 多行时尽可能打印尾随逗号<none|es5|all>
    bracketSpacing: true, // 对象文字中打印括号之间的空格
    jsxBracketSameLine: true, // 将>多行JSX元素放在最后一行的末尾，而不是单独放在下一行
    arrowParens: "avoid", // 在单个箭头函数参数周围加上括号<avoid|always>
    requirePragma: false,
    proseWrap: "preserve"
};

package.json做一下修改

{
  "devDependencies": {
    "husky": "^4.3.0",
    "lint-staged": "^10.5.1",
    "prettier": "^2.1.2",
    "tslint": "^6.1.3",
    "typescript": "^4.0.5"
  },
  "lint-staged": {
    "src/**/*.{js,ts,tsx}": [
      "prettier --write",
      "tslint --project tsconfig.json",
      "git add ."
    ]
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  }
}

3、提交时类型限制

还有如果对git提交的文案需要限制时，可添加以下依赖

npm install --save-dev @commitlint/config-angular @commitlint/cli

package.json 配置

{
  "devDependencies": {
    "@commitlint/cli": "^11.0.0",
    "@commitlint/config-conventional": "^11.0.0",
    "husky": "^4.3.0",
    "lint-staged": "^10.5.1",
    "prettier": "^2.1.2",
    "ts-node": "^9.0.0",
    "tslint": "^6.1.3",
    "typescript": "^4.0.5"
  },
  "lint-staged": {
    "src/**/*.{js,ts,tsx}": [
      "prettier --write",
      "tslint --project tsconfig.json",
      "git add ."
    ]
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    },
    "config": {
      "commitizen": {
        "path": "cz-customizable"
      }
    }
  }
}

然后项目目录下创建commitlint.config.js

// commitlint.config.js

module.exports = {
    extends: ["@commitlint/config-conventional"],
    rules: {
      "type-enum": [
        2,
        "always",
        ["feat", "fix", "docs", "style", "refactor", "test", "chore", "revert"]
      ],
      "subject-full-stop": [0, "never"],
      "subject-case": [0, "never"]
    }
  }

git 提交时需要注意

包括三个字段：type（必需）、scope（可选）和subject（必需）

• type：用于说明 commit 的类型，被指定在 commitlint.config.js 的 type-enum
  feat：新功能（feature）
  fix：修补bug
  docs：文档
  style： 格式（不影响代码运行的变动）
  refactor：重构（即不是新增功能，也不是修改bug的代码变动）
  test：增加测试
  chore：构建过程或辅助工具的变动
  revert: 回滚到上一个版本

有一种比较特殊的情况： revert

如果当前 commit 用于撤销以前的 commit，则必须以revert:开头，后面跟着被撤销 Commit 的 Header。

revert: feat(pencil): add 'graphiteWidth' option
This reverts commit 667ecc1654a317a13331b17617d973392f415f02.

• scope: 可以省略；用于说明 commit 的影响范围，比如数据层、控制层、视图层等等，视项目不同而不同
• subject：subject 是 commit 目的的简短描述，不超过50个字符
  以动词开头，使用第一人称现在时，比如change，而不是changed或changes
  第一个字母小写
  结尾不加句号（.）

subject 注意冒号后面有空格，不能以大写字母开头

没有空格，错误如下

  ✖ message may not be empty [subject-empty]

  ✖ type may not be empty [type-empty]

大写字母开头报以下错误：

  ✖ subject must not be sentence-case, start-case, pascal-case, upper-case [subject-case]

注：学习阶段，做下记录，如有不正确的地方请指出，我会尽快调整修改，谢谢