eslint配合git hook規範代碼

ESLint： 是一個插件化而且可配置的JavaScript語法規則和代碼風格的檢查工具。
官方配置文檔
使用介紹

一、經過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文件夾

二、使用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"
  },

四、使用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": {
    }
};

三、使用eslint-config-airbnb替換默認的eslint-config-recommend