前言

项目一般都是几个开发一起迭代升级，那肯定存在各种代码风格、格式化以及命名等等，懂得都懂💩，所以项目规范就凸显出来了呀，以下主要是介绍工具自动化使用~

husky

安装husky

pnpm add --save-dev husky

.husky下新增commit-msg文件

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

测试 

 

prettier

pnpm add --save-dev --save-exact prettier

.prettierrc 

{
  "trailingComma": "es5",
  "tabWidth": 4,
  "semi": true,
  "singleQuote": true
}

 格式化之前

格式化之后

eslint

pnpm create @eslint/config@latest

eslint.config.js

import globals from "globals";
import pluginJs from "@eslint/js";
import tseslint from "typescript-eslint";
import pluginReact from "eslint-plugin-react";


/** @type {import('eslint').Linter.Config[]} */
export default [
  {files: ["**/*.{js,mjs,cjs,ts,jsx,tsx}"]},
  {files: ["**/*.js"], languageOptions: {sourceType: "commonjs"}},
  {languageOptions: { globals: globals.browser }},
  pluginJs.configs.recommended,
  ...tseslint.configs.recommended,
  pluginReact.configs.flat.recommended,
];

lint-staged

package.json

    "lint-staged": {
      "*.{js,ts,json,md,yml,yaml,vue}": [
        "prettier --write",
        "pnpm lint -- --fix"
      ]
    }

pre-commit

npx lint-staged

commit的时候会做格式化和代码检测 

其他

分支管理、命名规范、code review和代码规范等等......