Adding a package immediately after created by create-react-app is not working

Question

I am very new to react (started a day ago). I used the create-react-app command line to create an app. I tried in the following order

• create-react-app my-app
• npm start

At this point the app is running fine. Then I did the following

• npm install youtube-api-search
• npm start

Now i am getting this error

[email protected] start /Users/shanmugharajk/Code/udemy/my-app react-scripts start

sh: react-scripts: command not found npm ERR! file sh npm ERR! code ELIFECYCLE npm ERR! errno ENOENT npm ERR! syscall spawn npm ERR! [email protected] start: react-scripts start npm ERR! spawn ENOENT npm ERR! npm ERR! Failed at the [email protected] start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

This happens every single time with any package I try to install.

One think I noted is when i run

• npm install youtube-api-search or any pckage it always removes some package. The message I am getting while installing any package is

npm WARN registry Using stale data from https://registry.npmjs.org/ because the host is inaccessible -- are you offline? npm WARN registry Unexpected warning for https://registry.npmjs.org/: Miscellaneous Warning ENOTFOUND: request to https://registry.npmjs.org/redux failed, reason: getaddrinfo ENOTFOUND registry.npmjs.org registry.npmjs.org:443 npm WARN registry Using stale package data from https://registry.npmjs.org/ due to a request error during revalidation. npm WARN gentlyRm not removing /Users/shanmugharajk/Code/udemy/my-app/node_modules/html-minifier/node_modules/.bin/uglifyjs as it wasn't installed by /Users/shanmugharajk/Code/udemy/my-app/node_modules/html-minifier/node_modules/uglify-js npm WARN gentlyRm not removing /Users/shanmugharajk/Code/udemy/my-app/node_modules/espree/node_modules/.bin/acorn as it wasn't installed by /Users/shanmugharajk/Code/udemy/my-app/node_modules/espree/node_modules/acorn npm WARN gentlyRm not removing /Users/shanmugharajk/Code/udemy/my-app/node_modules/autoprefixer/node_modules/.bin/browserslist as it wasn't installed by /Users/shanmugharajk/Code/udemy/my-app/node_modules/autoprefixer/node_modules/browserslist npm notice created a lockfile as package-lock.json. You should commit this file.

• [email protected] added 3 packages, removed 1142 packages and updated 3 packages in 27.043s

I couldn't figure out the reason. Please help me.

Answer 1

You are using npm 5. At the moment it has many issues.

I recommend to downgrade to npm 4 and try again:

npm install -g npm@4

rm -rf node_modules
rm package-lock.json
npm install

If it doesn't help check your internet connection. This looks like an issue with your network:

getaddrinfo ENOTFOUND registry.npmjs.org registry.npmjs.org:443

Answer 2

I got the answer, since I had yarn and npm both installed in my machine the create-react-app uses yarn and installs all the dependencies and creates yarn.lock file.

So now when I run npm install it looks for package.lock.json and it wont be there. So it uninstalls some package creates by yarn at the time of creation of the project.

So the solution I found is do any of the following

• create-react-app my-app
• npm install
• Then do install npm install -package-

Or

• create-react-app my-app
• yarn install -package-

Both of this approach is working now for me.