eslint-plugin-react 需要 eslint 的同伴吗?

eslint-plugin-react requires a peer of eslint?

我正在尝试在 Atom 编辑器上为 ReactJS 设置 eslint,所以我遵循提供的答案 :

但是,当我尝试安装 eslint-plugin-react 时,我收到警告:

eslint-plugin-react@7.7.0 需要 eslint@^3.0.0 的对等体 || ^4.0.0 但已安装 none。您必须自己安装对等依赖项。

目前安装的是eslint v4.19.1版本,我不知道是否需要降级我的eslint,因为我仍然收到JSX代码的错误

..

return (
      <div className="App">

...

错误:

Parsing error: Unexpected token < (Fatal)

我过去也遇到过问题。这是我为 React & Atom 设置 eslint 的方式。也可能对您有用(我知道您可能不需要某些软件包 - 留给您):

npm install -g create-react-app

create-react-app my-app
cd my-app

npm install --save-dev eslint babel-eslint eslint-plugin-react eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-flowtype  eslint-plugin-html eslint-config-jquery eslint-plugin-jquery prop-types

npm install --save react

A​​tom 中安装的 eslint 包:

linter-csslint
linter-eslint
linter-stylelint

这是我的 .eslintrc:

{
    "plugins": [
      "html",
      "jquery",
      "react"
   ],

    "extends": [
      "eslint:recommended",
      //"google",
      "jquery"
    ],

    "env": {
      "browser": true,
      "node": true,
      "es6": true
    },

//new3
//"parser": "babel-eslint",

// new2
  "parserOptions": {
      "ecmaVersion": 7,
      "sourceType": "module",
      "ecmaFeatures": {
          "jsx": true,
          experimentalObjectRestSpread: true
      }
  },

//new
//    "parserOptions": {
//      "ecmaVersion": 6,
//      "sourceType": "module"
//    },

    "globals": {
      $: false
    },

    "rules": {
      "react/jsx-uses-react": 2,
      "react/jsx-uses-vars": 2,
      "no-caller": 1,
      "linebreak-style": 0,
      'prefer-arrow-callback': 0,
      'no-var': 0,
      'eslint no-mixed-spaces-and-tabs': 0,
      "spaced-comment": 0,
      "no-mixed-spaces-and-tabs": 0,
      "one-var": 0,
      "space-in-parens": 0,
      "curly": 0,
      "jquery/no-ajax": 2,
      "no-alert": 0,
      "computed-property-spacing": 0,
      "array-bracket-spacing": 0,
      "no-console": 1,
      "jquery/no-animate": 2,
      "jquery/no-attr": 0,
      "jquery/no-bind": 2,
      "jquery/no-class": 2,
      "jquery/no-clone": 2,
      "jquery/no-closest": 2,
      "jquery/no-css": 2,
      "jquery/no-data": 2,
      "jquery/no-deferred": 2,
      "jquery/no-delegate": 2,
      "jquery/no-each": 2,
      "jquery/no-fade": 2,
      "jquery/no-filter": 2,
      "jquery/no-find": 2,
      "jquery/no-global-eval": 2,
      "jquery/no-has": 2,
      "jquery/no-hide": 2,
      "jquery/no-html": 0,
      "jquery/no-in-array": 2,
      "jquery/no-is": 2,
      "jquery/no-load": 2,
      "jquery/no-map": 2,
      "jquery/no-merge": 2,
      "jquery/no-param": 2,
      "jquery/no-parent": 2,
      "jquery/no-parents": 2,
      "jquery/no-parse-html": 2,
      "jquery/no-prop": 2,
      "jquery/no-proxy": 2,
      "jquery/no-ready": 1,
      "jquery/no-serialize": 2,
      "jquery/no-show": 2,
      "jquery/no-size": 2,
      "jquery/no-sizzle": 2,
      "jquery/no-slide": 2,
      "jquery/no-submit": 2,
      "jquery/no-text": 0,
      "jquery/no-toggle": 2,
      "jquery/no-trigger": 2,
      "jquery/no-trim": 2,
      "jquery/no-val": 0,
      "jquery/no-when": 2,
      "jquery/no-wrap": 2,
      "quotes": 0,
      "lines-around-comment": 1,
      "no-unreachable": 1
    }
}