Correct ESLint configuration for React and Meteor?

help
1

I use the config here but still so many weird errors:

So, how to create a correct eslint config for Meteor+React+JSX extension?
Thanks in advanced!

2

Hereā€™s an up to date (as of today) starter config for Meteor + React + JSX (using .jsx or .js):

  ...
  "devDependencies": {
    "babel-eslint": "^6.1.2",
    "eslint": "^3.5.0",
    "eslint-config-airbnb": "^11.1.0",
    "eslint-import-resolver-meteor": "^0.3.3",
    "eslint-plugin-import": "^1.15.0",
    "eslint-plugin-jsx-a11y": "^2.2.2",
    "eslint-plugin-meteor": "^4.0.0",
    "eslint-plugin-react": "^6.2.1"
  },
  "eslintConfig": {
    "parser": "babel-eslint",
    "parserOptions": {
      "allowImportExportEverywhere": true
    },
    "plugins": [
      "meteor"
    ],
    "extends": [
      "airbnb",
      "plugin:meteor/recommended"
    ],
    "settings": {
      "import/resolver": "meteor"
    },
    "rules": {
      "react/jsx-filename-extension": [
        1,
        {
          "extensions": [
            ".js",
            ".jsx"
          ]
        }
      ],
      "no-underscore-dangle": [
        "error",
        {
          "allow": [
            "_id"
          ]
        }
      ],
      "import/no-extraneous-dependencies": 0
    }
  }
1 Like
3

One trap is that Node needs to be in your path (on Windows) in order for SublimeLinter to work. If not, the Sublime Text console shows "SublimeLinter: eslint output: ā€˜nodeā€™ is not recognized as an internal or external command, operable program or batch file. "

Node is installed as part of Meteor, somewhere in the ~/AppData/Local/.meteor folder tree. But that tree structure changes from release to release, so itā€™s unreasonable to find where Node is today and point your path to it. My solution is to install Node separately, put its location in the path, and install the various eslint components in that copy of Node, rather than in Meteorā€™s copy, using npmā€™s -g flag to make those components available globally.

To put it another way, the ā€œInstalling and running ESLintā€ section of the Meteor Guide says to install eslint using ā€œmeteor npm install ā€¦ā€ It goes on to say that ā€œMeteor comes with npm bundled so that you can type meteor npm without worrying about installing it yourself. If you like, you can also use a globally installed npm command.ā€ Then the next section goes on to discuss integration with Sublime Text. But those instructions donā€™t work if youā€™ve setup eslint as recommended.

4

For anyone interested, you now need to add

"import/extensions": ["off", "never"],

because airbnb changed one of their rules

Issue is here