-
-
Notifications
You must be signed in to change notification settings - Fork 6.5k
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
fix(create-vite): remove eslint-plugin-react #19514
Conversation
Co-authored-by: Arnaud Barré <[email protected]>
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good to me 👍
}, | ||
} | ||
``` | ||
If you are developing a production application, we recommend using TypeScript and enable type-aware lint rules. Check out the [TS template](https://github.com/vitejs/vite/tree/main/packages/create-vite/template-react-ts) to integrate TypeScript and [`typescript-eslint`](https://typescript-eslint.io) in your project. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
🙏
- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked` | ||
- Optionally add `...tseslint.configs.stylisticTypeChecked` | ||
- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config: | ||
You can also install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) for React-specific lint rules: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe we can already mention it? Even if the code example is still for eslint-plugin-react
You can also install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) for React-specific lint rules: | |
You can also install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) or [[eslint-plugin-react-x](eslint-plugin-react-x](https://github.com/Rel1cx/eslint-react) for React-specific lint rules: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yeah maybe it's not a lot of work left than I expected. I wanted to rewrite this part to eslint-plugin-react-x
only though and suggest a code example for it.
I'll try to get to that later, but if not I think this PR is ok to be merged and I can create another PR later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
As you prefer, thanks for doing this!
Description
eslint-plugin-react
is setup in the react js template only as it requires thereact/jsx-use-vars
rule to properly check if a React component is used by eslint. It's not needed in the TS template astypescript-eslint
uses typescript itself to check for unused vars instead, which is more accurate.It feels a bit overkill to add a large dependency to handle this case, or introducing a single package with a single rule dealing with this. So I think it's easiest to ignore the var checks for variables that starts with an uppercase for now.
Alternatively we could keep things as is, so I wonder what others think about this. But I think it's useful to keep the dependency size down so it's easier for users to try out the template.