React is a well-known JavaScript library that programmers are using to build UI components. Being a front-end JavaScript library, it is used all over the world. The designing has become simpler with react.js, and that’s the reason even beginners are working on various projects to get their hands on the library in an efficient way. Data rendering is one of the features of react. You can have the error warning “Plugin “react” was conflicted between “package.json » eslint-config-react-app»” when working with react.
Although the error seems complex to newbies, it is a common error that you may encounter. We have some solid and quick fixes to the problem. But first, see how the error shows up
How the error occurs
After the code, when you compile it, the error message shows up.
The plugin "react" was conflicted between "package.json » eslint-config-react-app »Methods to Fix Error “Plugin “react” was conflicted between “package.json » eslint-config-react-app»”
We have some methods to resolve the error. Have a look at quick and simple ways to handle the exception
Method 1 – Check the name of the Directory
The prime cause of the error is the name of the folder or directory in capital letters. So, you need to ensure the name of the directory is in small caps. The name with capital letters throws the error warning. Simply changing the name with small caps can resolve the error.
Method 2 – Save your package.json file
The simplest solution to handle the error warning is to just save your package.json file. To do that, open the file and save it. You just need to press ‘ctrl + S’, and then run the app. Keeping running the app and repeat the same till the error warning goes away.
Method 3 – Downgrade the version to 6
Another effective way to fix the error is to downgrade the version. In order to lower the version to version 6, you need to first delete and then install. Follow the below commands to delete and install
To delete
yarn remove eslint-config-react-appTo install
yarn add eslint-config-react-app@6It can resolve the issue.
Method 4 – Rename the Project Name with lowercase
To solve the error, we need to change the name of the project to lowercase. We have also discussed the same in the first method. Now check how you can rename it a different way
- First, close your Visual Studio
- Just rename the folder to match the case of the name of the project.
- Reopen the Visual Studio and try opening the project again.
Conclusion
The above-mentioned methods are effective to handle the error “Plugin “react” was conflicted between “package.json » eslint-config-react-app»”. All methods are really simple yet powerful to resolve the issue.
I hope you find it helpful! I wish you luck!
Feel free to drop a message below in the comment box! We would be happy to assist you!
Reference Source: https://www.folkstalk.com/2022/09/plugin-react-was-conflicted-between-package-json-eslint-config-react-app-with-code-examples-2.html