-
-
Notifications
You must be signed in to change notification settings - Fork 21
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Document how to add eslint-plugin-react #388
Comments
I've setup a minimal project with what little knowledge I have of ESLint 9 here, drawing from the configuration provided from facebook/react#28313, specifically from this comment. While the project provides linting for React components and |
This is actually how I managed to do it so far. Still testing, but seems to be quite working. The only thing that doesn't yet was fixable with #132 however can't get it working with v9 import pluginJs from '@eslint/js';
// import tsParser from '@typescript-eslint/parser';
import eslintPluginAstro from 'eslint-plugin-astro';
import importPlugin from 'eslint-plugin-import';
import prettierRecommended from 'eslint-plugin-prettier/recommended';
import reactPlugin from 'eslint-plugin-react';
import hooksPlugin from 'eslint-plugin-react-hooks';
import tseslint from 'typescript-eslint';
export default [
// global ignores
{ ignores: ['dist/*', 'node_modules/*'] },
// standard js rules
pluginJs.configs.recommended,
// standard typescript rules
...tseslint.configs.recommended,
// override typescript rules
{
rules: {
'@typescript-eslint/explicit-function-return-type': 0,
'@typescript-eslint/explicit-module-boundary-types': 0,
'@typescript-eslint/no-empty-function': 0,
'@typescript-eslint/no-unused-expressions': 0,
'@typescript-eslint/no-empty-interface': 0,
'@typescript-eslint/no-explicit-any': 0,
'@typescript-eslint/no-unused-vars': [
'error',
{
varsIgnorePattern: '^_',
argsIgnorePattern: '^_',
caughtErrorsIgnorePattern: '^_',
},
],
},
},
// astro rules
...eslintPluginAstro.configs.recommended,
// react rules
{
files: ['**/*.{js,mjs,cjs,ts,jsx,tsx}'],
settings: {
react: {
version: 'detect',
},
},
languageOptions: {
parserOptions: {
ecmaFeatures: {
jsx: true,
},
},
},
...reactPlugin.configs.flat.recommended,
},
// react hooks
{
plugins: {
'react-hooks': hooksPlugin,
},
rules: {
...hooksPlugin.configs.recommended.rules,
},
},
// override react rules
{
rules: {
'react/react-in-jsx-scope': 'off',
'react/prop-types': 'off',
},
},
// prettier rules
prettierRecommended,
// TODO doesnt work yet
// define the configuration for `<script>` tag.
// script in `<script>` is assigned a virtual file name with the `.js` extension.
// {
// files: ['**/*.astro/*.js', '*.astro/*.js'],
// parser: tsParser,
// rules: {
// 'prettier/prettier': 'off',
// },
// },
// import rules
{
...importPlugin.flatConfigs.recommended,
rules: {
'import/order': [
'error',
{
groups: ['builtin', 'external', 'parent', 'sibling', 'index'],
alphabetize: {
order: 'asc',
},
},
],
},
},
]; |
It would be awesome if someone can share how they added eslint-plugin-react together with this plugin.
The text was updated successfully, but these errors were encountered: