团队代码格式化

• husky：工程化的根基，可以在进行 git 操作的时候，对 git 提供的一系列钩子进行拦截并执行相应的操作。例如对代码进行校验等。
• commitlint：代码的提交规范检验。可以对代码的 commit 内容进行校验，确保团队中的 commit 保持规范化，方便团队协作和快速定位问题。
• Lint-staged：前端文件过滤工具。代码的格式化工具肯定会涉及到文件系统，一般工具会先读取文件，格式化操作后重新写入。这个工具可以将 git 代码暂存区文件过滤出来，仅仅对被 committed 的文件进行处理。
• eslint：代码校验工具。eslint 不多介绍了，规范代码格式的工具，保证代码不出现一些低级错误。
• prettier：代码格式化工具。eslint 仅对代码中有问题的地方进行修改，不改动代码风格。而 prettier 是一款代码格式化工具，可以保证团队的代码风格一致。
• stylelint：代码校验工具。eslint 是 js 代码的格式规范工具，那 stylelint 则是 css 代码的格式规范工具，引入 stylelint 可以规范 css 代码的格式。

// package.json——husky、lint-staged 配置
"husky": {
  "hooks": {
    // commit-msg，对提交信息进行校验
    "commit-msg": "commitlint -E HUSKY_GIT_PARAMS",
    "pre-commit": "lint-staged"  // pre-commit，提交前的钩子
  }
},
"lint-staged": {
  // 此处可以配置文件夹和文件类型的范围
  "src/**/*.{js,vue}": [
    "eslint --fix",  // 先使用 eslint 进行 js 规范化修复
    "git add"  // 通过的话执行 git 将规范后的代码 add
  ],
  "src/**/*.{html,vue,css,sass,scss}": [
    "stylelint --fix",  // 使用 stylelint 进行 css 规范化修复
    "git add"
  ]
}

// webpack.config.js——stylelint配置
const StyleLintPlugin = require('stylelint-webpack-plugin')
module.exports = (env) => {
  ...
  plugins: [
    new StyleLintPlugin({
      files: ['src/**/*.{html,vue,css,sass,scss}'],
      fix: false, // 自动修复所有文件，旧项目不建议打开，新项目可以
      cache: true,
      emitErrors: false,
      failOnError: false,
      quiet: false, // 让控制台不显示报错
      lintDirtyModulesOnly: true // 只对新增的做校验 Lint only changed files, skip lint on start.
    })
  ]
  ...
}

// commitlint.config.js——commitlint 配置
module.exports = {
	extends: [
		"@commitlint/config-conventional"
	],
	rules: {
		'type-enum': [2, 'always', [
			'upd', 'feat', 'fix', 'refactor', 'docs', 'chore', 'style', 'revert'
		]],
		'type-case': [0],
		'type-empty': [0],
		'scope-empty': [0],
		'scope-case': [0],
		'subject-full-stop': [0, 'never'],
		'subject-case': [0, 'never'],
		'header-max-length': [0, 'always', 72]
	}
}

// stylelint.config.js——stylelint 配置
module.exports = { // 此文件更改后, 需npm run dev 才能生效
  defaultSeverity: 'error',
  extends: ['stylelint-config-standard'], // 使用标准规则
  plugins: ['stylelint-scss'],
  rules: { // 规则地址：https://stylelint.docschina.org/user-guide/rules/
    'rule-empty-line-before': null, // 必须要有空行, 关闭
    'at-rule-no-unknown': null, // 某些语法识别不了, 比如 for循环
    'number-leading-zero': null, // .1 和 0.1 同时支持
    'no-descending-specificity': null, // 禁止在具有较高优先级的选择器后出现被其覆盖的较低优先级的选择器
    'declaration-block-trailing-semicolon': null, // 要求或禁止声明块的一个尾随分号（可自动修复）
    'font-family-no-missing-generic-family-keyword': null // 关闭: 禁止在字体族名称列表中缺少通用字体族关键字。
  }
}

// .stylelintignore——stylelint 配置
node_modules
dist
www
lib
.idea
.vscode