Why ELIFECYCLE error occurs while running npm start? - reactjs

I had created a new react project and while running it using npm start it shows me ELIFECYCLE error.
I had tried deleting the package.lock.json and node_modules and removed the dependencies and done a fresh npm install. Eventhough the same error occurs again.
This is my package.json file:
{
"name": "tables",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.9.0",
"react-dom": "^16.9.0",
"react-scripts": "3.1.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
C:\Users\Srinithi K\tables
this is my path where the react project called tables is present.
output after running npm start:

This might be due to package-lock.json file. If you had not run eject, it might not have occurred. Installing the latest version of npm would help.
Try these fixes:
Go to your application directory in the command prompt,
rm -rf node-modules
npm install npm#latest -g
npm install
You might consider the following command if the above fix doesn't work.
npm install react-scripts

Related

EVERY TIME I RUN "npm run build" i got this error

this is the error shown in terminal when i run "npm run build"
'CI' is not recognized as an internal or external command,
operable program or batch file.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! reminder#0.1.0 build: `CI= react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the reminder#0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
this is my package.json
and i think i have error due to "build" : "CI= react-scripts build"
so please review my code and answer it
{
"name": "reminder",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.3"
},
"scripts": {
"start": "react-scripts start",
"build": "CI= react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

react.js & tailwind.css project not deploying to heroku properly

I have a create-react-app that I have successfully gotten up and running on my localhost, with all of the features of tailwind.css available for me to integrate with my JSX. It compiles fine and I used this tutorial to accomplish this: https://codingthesmartway.com/using-tailwind-css-with-react/.
An example of an error, commas representing new console log lines, is: npm ERR! react-tailwindcss#0.1.0 build:css: postcss src/styles/tailwind.css -o src/styles/main.css, npm ERR! spawn ENOENT, npm ERR!, npm ERR! Failed at the react-tailwindcss#0.1.0 build:css script. I used heroku logs --tail to get this information. I am at a loss as to how to fix this issue. This is the app: https://peaceful-island-18911.herokuapp.com/. It should look like (and does on my localhost) the end result of the tutorial mentioned. I know there has to be a way to get a react w/ tailwindcss app deployed to heroku and function as it does on localhost. I have done it before using the more common css framework bootstrap.
Below is my package.json file with my scripts and dependencies. I followed the tutorial I mentioned above for my file architecture. I am a newer dev so please go easy on me but any help or guidance in solving this issue will be greatly appreciated. I really hope this is a simple fix beginner mistake! Thank you.
{
"name": "react-tailwindcss",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.5.0",
"#testing-library/user-event": "^7.2.1",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1"
},
"scripts": {
"start": "npm run build:css && react-scripts start",
"build": "npm run build:css && react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"build:css": "postcss src/styles/tailwind.css -o src/styles/main.css",
"prebuild": "npm run build:css",
"prestart": "npm run build:css"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"devDependencies": {
"autoprefixer": "^9.8.6",
"postcss-cli": "^7.1.1",
"tailwindcss": "^1.6.2"
}
}

npm start not working in create-react-app: missing script:start

I tried to update my version of create-react-app by doing this:
If you've previously installed create-react-app globally via npm
install -g create-react-app, we recommend you uninstall the package
using npm uninstall -g create-react-app to ensure that npx always uses
the latest version.
But now, when I run npm start, i get an error message:
missing script: start
But in the package.json from my app, i found the start script:
{
"name": "dropzone-montessori",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-scripts": "3.2.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
Anybody knows what's happening?

When start server by using `yarn start` in CRA, server is opend too slow

Using CRA, server is opened after about 2 minutes!
Uninstall create-react-app
Uninstall node(npm), yarn clearly
Install node by using nvm
Install yarn using npm
npx create-react-app test
yarn test
same result...
node version: v12.10.0
yarn version: 1.17.3
npx version: 6.10.3
When yarn start,
Starting the development server...
after about 2 minutes...server open!
Before 2 week, It was so fast!
(+ macOS version: 10.14.2, 2015 early, RAM 8G)
How can I speed up my server opening?
It's CRA package.json
{
"name": "test",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.9.0",
"react-dom": "^16.9.0",
"react-scripts": "3.1.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

error with npm start after create-react-app

I am new to React.js. And I followed the tutorials in https://github.com/facebook/create-react-app. It worked fine while running npm init react-app my-app. But I got error when I run npm start.
detailed error message:
I have tried https://stackoverflow.com/questions/39959900/npm-start-error-with-create-react-app. That dose not work for me. I also tried move my project folder to upper directory, which still doesn't work.....
Can anyone fix it?
add: package.json
{
"name": "my-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"react": "^16.5.2",
"react-dom": "^16.5.2",
"react-scripts": "2.0.5"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
]
}
try npm install -g
to update npm
then rm -rf node_modules to delete the existing modules
finally npm install install the new project dependencies

Resources