react 配置eslint 并 auto esLint auto fix

安装配置，安装esLint eslint-plugin-prettier prettier

// eslintrc.js
const prettierrc = require('./.prettierrc.js')

module.exports = {
  "parser": "babel-eslint",
  "parserOptions": {
    "sourceType": "module",
    "ecmaVersion": 7,
    "ecmaFeatures": {
      "jsx": true,
      "legacyDecorators": true,
      "experimentalObjectRestSpread": true
    }
  },
  "env": {
    "browser": true,
    "node": true,
    "es6": true,
    "jest": true
  },
  "extends": [
    "eslint:recommended",
    "plugin:react/recommended",
    "prettier"
  ],
  "plugins": [
    "import",
    "react",
    "prettier"
  ],
  "globals": {
    "API_SERVER_PLACEHOLDER": true,
    "API_PUB_PLACEHOLDER": true,
    "API_INTEGRATION_PLACEHOLDER": true,
    "API_MONITOR_PLACEHOLDER": true
  },
  "rules": {
    "quotes": [
      "warn",
      "single"
    ],
    "no-unused-vars": "off",
    "no-console": [
      "error",
      {
        "allow": [
          "log",
          "warn",
          "error"
        ]
      }
    ],
    "no-empty": [
      "error",
      {
        "allowEmptyCatch": true
      }
    ],
    "semi": [
      "warn",
      "never"
    ],
    "eol-last": "off",
    "comma-dangle": [
      "error",
      "never"
    ],
    "no-prototype-builtins": "off",
    "react/react-in-jsx-scope": "off",
    "react/prop-types": "off",
    "react/display-name": "off",
    'prettier/prettier': ['error', prettierrc]
  }
}

• prettier

// prettierrc.js
  module.exports = {
  "parser": "babel",
  "useTabs": false,
  "tabWidth": 2,
  "semi": false,
  "singleQuote": true,
  "trailingComma": "none",
  "bracketSpacing": true,
  "jsxBracketSameLine": false,
  "arrowParens": "avoid",
  "endOfLine": "auto",
  "printWidth": 80
}

当然 eslint 配置 与 prettier 是相对的