eslint-plugin-react需要一个eslint对等体?

时间:2018-04-05 03:48:58

标签: reactjs atom-editor jsx eslint

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

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

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

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

...

return (
      <div className="App">

...

错误:

Parsing error: Unexpected token < (Fatal)

1 个答案:

答案 0 :(得分:1)

我过去也遇到过问题。这是我设置eslint for react&amp; amp;原子。也可以为你工作(我知道你可能不需要一些包 - 留给你):

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

在Atom中安装的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
    }
}