React Native ESLint Config

.eslintrc

{
  "parser": "babel-eslint",
  "plugins": ["react", "react-native"],
  "env": {
    "browser": true,
    "node": true
  },
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true,
      "modules": true
    }
  },
  "extends": ["eslint:recommended", "plugin:react/recommended", "airbnb-base"],
  "rules": {
    "arrow-body-style": "warn",
    "linebreak-style": "off",
    "no-use-before-define": [
      "error",
      {
        "variables": false
      }
    ],
    "react/prop-types": "off",
    "max-len": [
      2,
      {
        "code": 140,
        "tabWidth": 4,
        "ignoreUrls": true
      }
    ],
    "no-return-assign": 0,
    "no-plusplus": 0,
    "class-methods-use-this": 0,
    "comma-dangle": 0,
    "global-require": 0,
    "prefer-const": 0,
    "object-curly-newline": 0,
    "import/no-named-as-default": 0,
    "import/no-named-as-default-member": 0,
    "spaced-comment": 0,
    "dot-notation": 0,
    "import/prefer-default-export": 0,
    "implicit-arrow-linebreak": 0,
    "space-before-function-paren": 0,
    "arrow-parens": ["error", "always"],
    "react/no-deprecated": "warn",
    "no-param-reassign": [
      "error",
      {
        "props": false
      }
    ],
    "prefer-promise-reject-errors": [
      "error",
      {
        "allowEmptyReject": true
      }
    ]
  }
}

.prettierrc

{
  "singleQuote": true,
  "printWidth": 120,
  "tabWidth": 2,
  "useTabs": false,
  "arrowParens": "always",
  "overrides": [
    {
      "files": ".prettierrc",
      "options": {
        "parser": "json"
      }
    }
  ]
}

setup

npm install --save-dev eslint-plugin-import eslint babel-eslint eslint-config-airbnb-base eslint-plugin-react eslint-plugin-react-native

代码规范强制检查

IDE安装两个插件，ESLint 和 Prettier - Code formatter，用来做代码语法检查和格式化

配合工程根目录下的几个配置文件生效：

• .eslintrc ESLint插件和脚本检查配置，执行代码规范检查：npm run lint，自动修复代码：npm run lint-fix （只能少部分修复）
• .prettierrc Prettier插件配置
• .editorconfig VSCode编辑器自带配置

最后再配合 husky 来限制git message 提交规范和代码规范检查： giscafer/blog#28