Dependencies disappear when I try to install a new one - reactjs

I started working for a company a week ago and cloned the react-native app folder from GitHub. Everything was fine until I installed a new package, specifically react-native-webview, the moment I ran the command 'npm install react-native-webview' I lost the other dependencies and messed up the configuration for typescript and got countless errors in the application. Does anyone know what the problem is?
Package error
Typescript error
All dependencies installed

Related

React server won't start after installing styled-components

Disclaimer: this is my first question on Stack Overflow, so apologies if it's not formatted correctly. Please let me know how I can improve it or if more details are needed.
I tried to install styled-components for my React app with the following command npm install --save styled-components.
Before I did this, my server started up just fine with npm start.
After install, React tries to start up the development server but it stops and returns the following errors:
cacheEntry.sizeOnlySource = new SizeOnlySource(size);
TypeError: SizeOnlySource is not a constructor
at updateFileWithReplacementSource (project-directory/node_modules/webpack/lib/Compiler.js:756:37)
at updateWithReplacementSource (project-directory/node_modules/webpack/lib/Compiler.js:738:8)
at processMissingFile (project-directory/node_modules/webpack/lib/Compiler.js:801:8)
at project-directory/node_modules/webpack/lib/Compiler.js:843:10
at Immediate.<anonymous> (project-directory/node_modules/memfs/lib/volume.js:698:17)
Initially, I tried uninstalling the styled-components package. Same errors. Then, I tried updating webpack with npm update webpack.
I googled the errors but they were all for problems that seemed unrelated or that are now fixed.
Support Webpack 4.29.0 breaking change
output.futureEmitAssets option breaks compatibility with source map upload plugins
library target umd - Uncaught TypeError: x is not a constructor
I did come across a post on Stack Overflow explaining that --save is no longer necessary as of npm version 5.0.0. Perhaps it's the source of the error?
Note that I installed the styled-components package on a separate branch of my project, but the server still won't start when I switch to the main branch and I'm getting the same errors.
Honestly, I have no idea what's going wrong or how to fix it. Any help or guidance would be greatly appreciated.
Edit: before the Starting development server... line I get after running npm start, there's some kind of message about webpack being deprecated. I hadn't noticed that before, but it flashes by too quickly for me to read it and I can't scroll up to see the message. I created a new React project from scratch to see if the server would start. It does, but I'm still getting the aforementioned messages.

Ant Design Cannot find module 'rc-textarea'

I just created an Umi Ant Design Pro project but when i run my project (yarn start),i am getting the following error:
Steps taken to resolve this issue:
1:installed rc-textarea:
yarn add rc-textarea
2:stopped my server and ran yarn again in my terminal
3:then ran yarn start to start my server and still got the same error although my terminal this time stopped displaying the error i keep getting in my browser as seen below:
Step4:I then did some Research and came across this link
Git Memory Blog
But the path : ./node_modules/antd/es/input/TextArea.js does not exist in my project.
I also found a github link with a similar issue:
GithubIssue
Other solutions did not work so i tried wbcs's solution:
yarn cache clean
yarn install
But the error is still eminent.
My inspection window indicates that this is a possible webpack issue:
How do i resolve this?
Try removing .umi and node_modules folders, and then start this project again.

React app is failing to compile, it appears typescript not being transpiled to JS?

I am working on a react app with a couple of colleagues, and after the latest pull I am no longer able to compile the app, but my colleagues are not having any issues.
On my end the app fails to compile because some #material-ui components are displayed as missing in the node_modules/#material-ui directory. However, when I search the folder, I see the files there, they are just shown in typescript format instead of js. However, when comparing my working directory with a colleague's it appears there are also files completely missing on my end that exists on theirs.
For example, when the app fails to compile I see this:
Failed to Compile
./node_modules/#material-ui/core/TextField/TextField.js
Module not found: Can't resolve '../FilledInput' in
'..../node_modules/#material-ui/core/TextField'
When I search this folder, the file is there but labelled 'FilledInput.d.ts'.
Has anyone encountered something like this? I have recompiled the app, and deleted the branch and recloned from remote but the issue remains.
Thanks
Have you tried removing node_modules and installing dependencies again?
Does npm install give any peer dependency warnings? Does this help?
npm i #material-ui/core --save

AngularJS1.5 injector issue (MacOSX)

Hey all I'm getting this Error Message when trying to use 'gulp serve-dev' on my codebase (https://github.com/CraigOldfield/AngularJSWork). The steps to reproduce where as follows:
Clone the repo onto my machine (this machine already had node
installed and gulp (globally).
Run npm install and bower install
Run gulp serve-dev form the root directory
Previous command opened a browser and the console is reporting the injector issue, this very same code worked this morning on my work (windows) computer, I am now on my home (Mac) computer.
Im very new to Mac so it could be something related to that, I'm hoping someone can give me some more information to help debug this issue.
For those looking at this question with the same problem, what worked for me is the following comment by Yadejo.
Yadejo's comment "You should keep your versions of angular and angular-animate in sync. Take a look here: stackoverflow.com/a/32768153/3980911"
Once I updated my bower.json file to have the same version for each of these dependancies, I ran 'npm install' and 'bower install' which fixed the issues I described in the question above.

npm script error while trying to install react-router-dom

While working on my react project, I just tried to install react-router-dom and somehow it seems it erased all my scripts and modules. Now I cannot run the server again no matter what I do. I also cleaned working directories and even deleted the branch, but it still doesn't work at all..
and below is the error message when I hit 'npm start'.
Although I don't know why installing react-router-dom removed all my packages, I reinstalled node modules and now it works again. :)

Resources