As I mentioned before, I’m learning the react.js framework, so I try to define projects and use different tools for them to learn other aspects of this framework.
On one of my first projects, I decide to use bootstrap for the front-end, but later I decide to use material-ui instead. I install material-ui and forgot to remove bootstrap. During the development of that project, I installed some other packages like moment.js, Font-Awesome, etc that after a while I understand never use them. So I decided to find a way of cleaning my project from these unused packages.
Using npm-check and depcheck to Track Dependencies
I found two tools for this that I try to explain how to use them. There is an exciting point during the use of these tools. These tools are for cleaning a project, so you should not somehow use them that themselves dirty the project. As I mentioned in Node.js Packages, Global vs Local Installation, you should install these packages globally.
npm-check and depcheck are tools that analyze dependencies by using the information provided by npm inside your React app’s package.json file and checking for your imports and not the actual code. These help to identify which npm packages are being utilized in your app and which are not.
The difference between these packages is that npm-check does a similar job of tracking dependencies but displays them in a more analytical and readably attractive manner. It uses color schemes to convey different information about an npm package being used in your app.
npm-check
npm install -g npm-check
npm-check
depcheck
npm install -g depcheck
depcheck
You will mostly need to run the command in the root directory of your project and ensure that the directory of these commands contains the package.json file.
Uninstalling Packages
You can uninstall any npm package or dependency by running the following command:
npm uninstall --save <package_name>