如何在Atom編輯器上為React配置ESLint

Question

在Atom Editor中，我安裝了以下插件

1. 棉短絨
2. 棉短絨，eslint

它們似乎無法識別JSX語法。

我讓它在命令行上工作，但不得不使用其他插件，如esprima-fb和eslint-plugin-react 。 看起來Atom編輯器沒有這樣的插件，想知道你是否有人知道如何解決這個問題。

Answer 1

讓Eslint與React.js很好地配合：

1. 安裝linter＆linter-eslint插件
2. 運行npm install eslint-plugin-react
3. 將"plugins": ["react"]到.eslintrc配置文件中
4. 將"ecmaFeatures": {"jsx": true}到.eslintrc配置文件中

以下是.eslintrc配置文件的示例：

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

    "globals": {
        "React": true
    },

    "ecmaFeatures": {
        "jsx": true
    },

    "plugins": [
        "react"
    ]
}

我目前正在使用Eslint v1.1.0。

旁注 ：我必須安裝eslint和eslint-plugin-react作為項目依賴項（例如， npm install eslint eslint-plugin-react --save-dev ）。 希望這會有所幫助。

Answer 2

2016年的更新答案：只需在Atom中安裝react包，並在項目根目錄（或主目錄）中添加一個.eslintrc文件，其中包含以下內容：

{
  "parserOptions": {
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "env": {
    "es6": true
  }
}

並重新打開包含JSX的任何文件，它應該工作。

Answer 3

您需要編輯一個項目本地.eslintrc文件，該文件將被ESLint選中。 如果你想用的Atom集成，您可以安裝插件棉短絨和棉短絨，eslint 。

要快速設置ESLint for React最佳實踐，當前最佳選擇是安裝npm包eslint-plugin-react並擴展其recommended配置，而不是手動切換許多規則：

{
  "extends": [ "eslint:recommended", "plugin:react/recommended" ],
  "plugins": [ "react" ]
}

這將啟用eslint-plugin-react和React預設的eslint-plugin-react和推薦規則。 最新的ESLint 用戶指南本身提供了更多有價值的信息。

以下是針對ES6和webpack優化的解析器選項示例：

{
  "parserOptions": {
    "sourceType": "module",
    "ecmaVersion": 6,
    "ecmaFeatures": {
      "impliedStrict": true,
      "experimentalObjectRestSpread": true,
      "jsx": true
    }
  }
}

Answer 4

我使用Atom，它工作得很好。 你只需要一個.eslintrc項目中的根，它告訴您使用ESLint eslint-plugin-react 。

Answer 5

1. 對於Mac用戶：轉到Atom - >首選項 - >安裝 - >搜索包linter-eslint - >單擊安裝

2. 對於Ubuntu用戶：轉到編輯 - >首選項 - >安裝 - >搜索包linter-eslint - >單擊安裝

3. 轉到命令行---> npm install --save-dev eslint-config-rallycoding

4. 來源原子制作新文件.eslintrc並擴展拉力賽編碼。