Eslint-plugin-react: babel-eslint vs eslint-plugin-babel vs eslint-plugin-react

Created on 16 Feb 2016 · 3Comments · Source: yannickcr/eslint-plugin-react

I am relatively still learning linting with eslint.

Can you please differentiate purpose of eslint-plugin-babel in comparison to babel-eslint vs eslint-plugin-babel ?

Source

ahmed1490

Most helpful comment

babel-eslint is a parser, it will transform your JavaScript code into an AST that will be used by ESLint to validate your code. You can see what an AST looks like on AST Explorer. ESLint support a few parsers with different capabilities. Babel-eslint is great since it does support all valid Babel code, so it is a good companion if you are already compiling your JavaScript with Babel.
eslint-plugin-* are ESLint plugins, they add some additional rules to ESLint. Most of the plugins can be found on npm with the eslintplugin keyword.
- eslint-plugin-babel add some rules for some of the Babel experimental features which are not natively supported by ESLint because it is... experimental.
- eslint-plugin-react add some rules specifically for React, this mostly include good practices and JSX code formatting.

yannickcr on 16 Feb 2016

👍10 🎉1

babel-eslint is a parser, it will transform your JavaScript code into an AST that will be used by ESLint to validate your code. You can see what an AST looks like on AST Explorer. ESLint support a few parsers with different capabilities. Babel-eslint is great since it does support all valid Babel code, so it is a good companion if you are already compiling your JavaScript with Babel.
eslint-plugin-* are ESLint plugins, they add some additional rules to ESLint. Most of the plugins can be found on npm with the eslintplugin keyword.
- eslint-plugin-babel add some rules for some of the Babel experimental features which are not natively supported by ESLint because it is... experimental.
- eslint-plugin-react add some rules specifically for React, this mostly include good practices and JSX code formatting.