angular application breaking on installing a package

Question

I have cloned an existing angular project. I did ng serve and the application is running fine. I wanted to install signalR package. I have executed

npm install @aspnet/signalr –-save

The package is installed successfully. But then when I run ng serve, the project has failed to compile with errors

ERROR in ./src/app/PackageAdd.component.ts
Module not found: Error: Can't resolve 'json-diff' in 'C:\Users\Web\src\app\components'
ERROR in ./src/app/components/Update.modal.ts
Module not found: Error: Can't resolve 'json-diff' in 'C:\Users\Web\src\app\components'
ERROR in ./src/app/components/CreateEdit.component.ts

So I wanted to revert back to the initial state and tried to uninstall the package. I tried with

npm uninstall @aspnet/signalr

and then did ng serve but still see the same errors. I am not sure what to do now. How do I revert back to the initial state where the application is getting compiled successfully and running.

Answer 1

This doesn't seem to be an error from Signalr. From the error you've provivded, I'm guessing there's a json-diff npm package being used in your project (look in package.json for it).

If it's not supposed to be there (check the original code), remove the code related to json-diff from the Update.modal.ts and CreateEdit.component.ts files.

If it's supposed to be there, make sure it's listed in package.json (otherwise, install it). If it's already installed, delete the package-lock.json file and the node_modules folder, and run npm install again.

If everything fails, and you just want to revert to the original branch code, run git clean -fd && git reset --hard (WARNING: this will remove all un-pushed local changes that you had done to the branch as well as new files that are not tracked by git). Confirm that the package-lock.json and node_modules folder are deleted in your project, and run npm install