Improve experience with React · sindresorhus/eslint-plugin-unicorn#1639

(3 comments) (15 reactions) (0 assignees)JavaScript (5,022 stars) (468 forks)user submission

enhancementhelp wanted

Description

React is a very popular package, but a couple of the rules need some configuring to make it work.

We could either improve the rules to detect React usage and apply overrides or provide a React preset. I would prefer the former if possible.

prevent-abbreviations:

"prop": false,
"props": false,
"ref": false,
"refs": false

filename-case: https://github.com/sindresorhus/eslint-plugin-unicorn/issues/203#issuecomment-794195756

Any other rules?

Tech stack: javascriptreact
Domain: developer experiencetooling
Issue type: feature
Difficulty: 3
Estimated time: half day
Activity status: fresh
Clarity: mostly clear
Prerequisites: basic understanding of ESLint pluginsfamiliarity with React conventions
Newbie friendliness: 60
Research direction: This issue proposes improving the eslint plugin unicorn project's default configuration for React projects. The two main suggestions are: (1) automatically detect React usage and apply overrides for rules like `prevent abbreviations` and `filename case`, or (2) provide a dedicated React preset. To contribute, examine the existing rule files (e.g., rules/prevent abbreviations.js and rules/filename case.js) and understand how the project currently handles rule configuration. Review the linked GitHub comment on issue #203 for community input on filename case. Consider proposing a solution that auto detects React by checking for imports from 'react' in the project. Submit a pull request with clear documentation and tests.