eslint配合git hook规范代码

ESLint： 是一个插件化并且可配置的JavaScript语法规则和代码风格的检查工具。
官方配置文档
使用介绍

1、通过eslint, husky规范代码，校验不通过不允许commit配置:
npm i eslint husky -D

package.json:
{
  "scripts": {
    "lint": "eslint src"
  },
  "husky": {
    "hooks": {
      "pre-commit": "npm run lint"
    }
  }
}

注意，用taro初始化项目后，生成了.git-->hook默认文件夹(里面都是.sample后缀的示例文件)，手动安装husky并不会覆盖这个文件夹，导致hook未正常添加，代码提交时没有触发hook钩子。

检查hook是否正常添加：安装husky时hooks会被添加到当前项目目录下的 .git > hooks 文件夹中。查看该目录下是否有类似 pre-commit 的git钩子脚本文件。没有的话可以尝试重新安装husky。如果已经有了git钩子脚本文件在执行git的时候钩子还是没有执行，可以尝试删除该 hooks 文件夹，再重新安装husky。注意如果hooks中有提前设置好的其他钩子，请谨慎删除hooks。

默认hook文件夹

删除hook目录，重新安装husky生成的hook文件夹

2、使用lint-staged工具，提交时只检测stage阶段的文件
Running a lint process on a whole project is slow and linting results can be irrelevant. Ultimately you only want to lint files that will be committed.

This project contains a script that will run arbitrary shell tasks with a list of staged files as an argument, filtered by a specified glob pattern.

package.json:
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged"
    }
  },
  "lint-staged": {
    "*.js": "eslint src --ext .js --fix", // --fix能在提交前自动修复末尾加不加分号这种代码风格错误，但无法修复变量未使用这种语法规则错误
    "*.vue": ""eslint src --ext .vue --fix"
  },

4、使用eslint检测.vue文件
只需安装eslint-plugin-vue，该插件依赖的vue-eslint-parser会一起被安装。

.eslintrc.js:
module.exports = {
    "env": {
        "browser": true,
        "es6": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:vue/essential"
    ],
    "globals": {
        "Atomics": "readonly",
        "SharedArrayBuffer": "readonly"
    },
    "parserOptions": {
        "ecmaVersion": 2018,
        "sourceType": "module"
    },
    "plugins": [
        "vue" // 配置eslint的插件
    ],
    "rules": {
    }
};

3、使用eslint-config-airbnb替换默认的eslint-config-recommend