uniapp配置初始化项目篇

上一篇介绍了关于 Eslint 和 prettier 的配置相关的东西，这里将继续介绍一下关于husky,lint-stage,commitlint规范相关配置

一 husky

husky Git hooks 工具, 可以在执行 git 命令时，执行自定义的脚本程序

1，下载husky

yarn add --dev husky

2，初始化husky配置文件

npx husky init

3，初始化完成后会在根目录下初始化.husky配置文件

project
├─.husky
│   └─_
│      ├─.gitignore
│      └─husky.sh
│---└─pre-commit

4，运行初始化命令后package.json文件中scripts会注入一股husky 初始化命令

lint-stage

lint-staged, 只会对git暂存区的文件执行git hooks命令，不会全量处理

1，安装

yarn add -D lint-staged

2，配置lint-staged

2.1 通过package.json配置

"lint-staged": {
    "*.{ts,tsx,js,jsx,cjs,mjs,vue}": "eslint --fix",
    "*.{ts,tsx,js,jsx,cjs,mjs,vue,css,scss,less,md,json}": "prettier --write"
}

2.2 通过配置文件 .lintstagedrc.json

{
    "*.{js,ts}": [
      "eslint --fix",
      "prettier --write"
    ],
    "*.{cjs,json}": [
      "prettier --write"
    ],
    "*.{vue,html}": [
      "eslint --fix",
      "prettier --write",
      "stylelint --fix"
    ],
    "*.{scss,css}": [
      "stylelint --fix",
      "prettier --write"
    ],
    "*.md": [
      "prettier --write"
    ]
 }

3，设置pre-commitgit hook 来运行lint-staged

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

然后.husky文件夹里出现名为pre-commit脚本文件

# .husky/pre-commit

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npx lint-staged

这样每次执行 git commit 都会先执行 npx lint-staged

三 commitlint

Commitlint 可以校验 git commit message, 只有规范的 message 才能提交，就是当我们运行git commmit -m 'message'时，来检查'message'是不是满足团队约定好的提交规范的工具。

• @commitlint/cli 是脚手架工具
• @commitlint/config-conventional 是官方推荐可继承的配置文件

1,安装

npm install --save-dev @commitlint/{cli,config-conventional,prompt-cli}

2，生成配置文件

echo "export default { extends: ['@commitlint/config-conventional'] };" > commitlint.config.js

// commitlint.config.js
这里的规则可以自己更改，通过上面的命令是生成es6格式的
module.exports = {
    // 继承的规则
    extends: ["@commitlint/config-conventional"],
    // 自定义规则
    rules: {
        // @see https://commitlint.js.org/#/reference-rules

        // 提交类型枚举，git提交type必须是以下类型
        "type-enum": [
            2,
            "always",
            [
                "feat", // 新增功能
                "fix", // 修复缺陷
                "docs", // 文档变更
                "style", // 代码格式（不影响功能，例如空格、分号等格式修正）
                "refactor", // 代码重构（不包括 bug 修复、功能新增）
                "perf", // 性能优化
                "test", // 添加疏漏测试或已有测试改动
                "build", // 构建流程、外部依赖变更（如升级 npm 包、修改 webpack 配置等）
                "ci", // 修改 CI 配置、脚本
                "revert", // 回滚 commit
                "chore", // 对构建过程或辅助工具和库的更改（不影响源文件、测试用例）
            ],
        ],
        "subject-case": [0], // subject大小写不做校验
    },
}

3，通过commit-msg，git hooks，检验提交时的message

npx husky add .husky/commit-msg  'npx --no -- commitlint --edit ${1}'
// 生成以下script

#!/bin/sh
. "$(dirname "$0")/_/husky.sh"

npx --no-install commitlint --edit $1

写在最后： 到这里基本的配置就全部结束了，如果有问题，欢迎大家指正