I have a React application, and a bunch of no-unused-vars in the console when running it getting me nuts, so I'm kindly asking you folks to share your experience: are there any such tools or no.

Screenshot of the console:

I have a React application, and a bunch of no-unused-vars in the console when running it getting me nuts, so I'm kindly asking you folks to share your experience: are there any such tools or no.

Screenshot of the console:

• javascript
• reactjs
• npm
• jsx

• why not just go through and tidy up your code? If these are unused imports at the top of files, most IDEs will be able to 'organize imports' e.g. in webstorm it's ctrl + option + o – andy mccullough Commented Jun 5, 2021 at 11:19
• First identify the file from where the unused variables occurs. Then ment them (if you want to keep them for future use) out or delete them. – dEBA M Commented Jun 5, 2021 at 11:27
• Hello, Andy! The screenshot doesn't express the whole problem, there are hundreds of those ponents and I'm looking for a more convinient tool to remove all of those, not manually. + those unused variables aren;t imported from somewhere, they are declared in current react ponent, and I just don't use them. – ReginaTheMean Commented Jun 5, 2021 at 11:31
• Hi, Deba! Thank you, I'm just looking forward if there is a tool that does everything instead of me, manually. – ReginaTheMean Commented Jun 5, 2021 at 11:34

2 Answers 2

When projects get large its a pain to manage old code, what I did is to write a script to find unused exports (these will not be picked up by eslint) it should show you where you have a export that is not imported anywhere

just run:

npx dead-exports

assuming that your code is in ./src

read more here:

https://www.npmjs./package/dead-exports

Use vs code with and ES7 React/Redux/GraphQL/React-Native snippets proper code formatter like prettier and you will find unused ponents in different color as pared to used ponent