I have node v12.16.2, and npm 7.16.0 running on Mac OS Big Sur 11.5.1.
I just installed a npx react project, with:
npx create-react-app frontend
and this is my package.json file:
{
"name": "frontend",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.11.4",
"#testing-library/react": "^11.1.0",
"#testing-library/user-event": "^12.1.10",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-scripts": "4.0.3",
"web-vitals": "^1.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
When I try to add:
npm i react-router-dom
I get the following error:
npm WARN tarball tarball data for
hoist-non-react-statics#https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz
(sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==)
seems to be corrupted. Trying again. npm WARN tarball tarball data for
hoist-non-react-statics#https://registry.npmjs.org/hoist-non-react-statics/-/hoist-non-react-statics-3.3.2.tgz
(sha512-/gGivxi8JPKWNm/W0jSmzcMPpfpPLc3dY/6GxhX2hQ9iGj3aDfklV4ET7NjKpSinLpJ5vafa9iiGIEZg10SfBw==)
seems to be corrupted. Trying again. npm ERR! code ENOENT npm ERR!
syscall lstat npm ERR! path
/Users/sven/.npm/_cacache/content-v2/sha512/fe/01/a2bf18bc24f296366fd6d234a6cdc30fa5fa4f2dcddd63fe86c615f6850f621a3dda0df925578113ecd8caa528a72e9279bda7daf62886204660d7449f07
npm ERR! errno -2 npm ERR! enoent ENOENT: no such file or directory,
lstat
'/Users/sven/.npm/_cacache/content-v2/sha512/fe/01/a2bf18bc24f296366fd6d234a6cdc30fa5fa4f2dcddd63fe86c615f6850f621a3dda0df925578113ecd8caa528a72e9279bda7daf62886204660d7449f07'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in: npm ERR!
/Users/sven/.npm/_logs/2021-08-02T09_21_43_877Z-debug.log
What could this issue be about: incompatible versions of node or npm for npx create react app?
npm cache clean
npm i react-router-dom --save
I don't know which directory you are running the second command from but you need to be in the project directory (same dir as package.json). cd frontend before the second command.
Related
I have seemingly tried everything and see conflicting instructions on deploying a React app (without API) to Azure Static Web Apps even from Microsoft. Has anyone done this successfully?
The latest doc I've used is:
https://learn.microsoft.com/en-gb/azure/static-web-apps/get-started-portal?tabs=react&pivots=github
which is for creating the SWA in the portal though I've used others as well with problems.
I've now arrived at this error:
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! percentage-calculator#0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the percentage-calculator#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:
npm ERR! /github/home/.npm/_logs/2022-07-12T19_38_33_349Z-debug.log
---End of Oryx build logs---
Oryx has failed to build the solution.
Here is my file structure if that matters:
react-app ->src ->components ->index.js,App.js etc..
->public ->index.html etc..
->build (build is gitignored)
->node_modules etc..
My azurestaticwebapps... yml file contains:
app_location: "/"
api_location: ""
output_location: "build"
https://github.com/markhardy/percentage-calculator/runs/7308960687?check_suite_focus=true
Can someone explain what I'm doing wrong? I'm at a loss at this point especially with conflicting instructions from Microsoft.
Seems you have warnings in your code, so the compiler doesn't like it.
Simply change the yml file as below:
under build_and_deploy_job, add:
env:
CI: false
This will stop treating warnings as errors.
Has anyone done this successfully?
We have followed the same document which you have provided and able to build and deploy React static web App from portal without any issues.
Build and Deploy Job:
package.json file:
{
"name": "hello",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^4.2.4",
"#testing-library/react": "^9.3.2",
"#testing-library/user-event": "^7.1.2",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-scripts": "3.4.0"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"playwright_test": "playwright 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"
]
},
"devDependencies": {
"#playwright/test": "^1.22.2"
}
}
Try to add devDependencies in your package.json file and check once.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#2.3.2 (node_modules/fsevents):
As per this Document, we can add optionalDependencies in your package.json file or can run npm install -f.
Please refer Troubleshooting deployment and runtime errors for Static Web Apps for more information.
I am learning docker and I am getting this error when I run
npm install
npm ERR! code ENOENT
npm ERR! syscall open
npm ERR! path D:\Docker Practice\section4-react-app/package.json
npm ERR! errno -4058
npm ERR! enoent ENOENT: no such file or directory, open 'D:\Docker Practice\section4-react-
app\package.json'
npm ERR! enoent This is related to npm not being able to find a file.
npm ERR! enoent
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\SIBA\AppData\Local\npm-cache\_logs\2022-04-08T10_01_09_620Z-debug-0.log
This is my package.json file showing all the dependencies
{
"name": "react-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"#testing-library/jest-dom": "^5.11.4",
"#testing-library/react": "^11.1.0",
"#testing-library/user-event": "^12.1.10",
"react": "^17.0.1",
"react-dom": "^17.0.1",
"react-scripts": "4.0.3",
"web-vitals": "^1.0.1"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}
I am following mosh tutorial to learn docker.
My task is to run npm install so it automatically installs all the dependencies listed in this project but I am getting above error.
Can someone help me out in this.
I know the versions may be old but it's completly fine as docker will run all the code according to the given dependencies.
So, instead of updated version, I need my application to be build with this version of software and then deploy it to docker container.
Looking forward to hear from you.
Source code is present here
Regards,
Ali
You must run the npm install in the directory where package.json is located, the error clearly states that npm cannot find the package.json:
npm ERR! enoent ENOENT: no such file or directory, open 'D:\Docker
Practice\section4-react- app\package.json' npm ERR!
enoent This is related to npm not being able to find a file.
So it must be some issue with the path.
Though to debug this error, the provided information is not enough:
Open up your terminal or cmd and go to the directory where package.json is located (using the cd command)
run the ls command, it will show all the files present in the directory
take the screenshot of your terminal now and post it here
then run npm install and again take a screenshot of your terminal and post it here.
so I don't remember updating anything, but npx stopped working for me today!
other older react projects still working (npm start). So when I'm creating new react project:
npx create-react-app test
cd test
npm start
I got this webpack error:
Failed to compile.
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.module.rules[2].oneOf[1].include: The provided value "/home/coding/!convr/test/src" contains exclamation mark (!) which is not allowed because it's reserved for loader syntax.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! test#0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the test#0.1.0 start 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 log:
package.json
{
"name": "test",
"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": "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"
]
}
}
PS: sorry for making it that long, but I need to figure it out
This is the error :
my-app#0.1.0 start /home/gaurav/Desktop/Django + React/Saurav Hardware/saurav_hardware/my-app
react-scripts start
sh: 1: react-scripts: not found
npm ERR! code ELIFECYCLE
npm ERR! syscall spawn
npm ERR! file sh
npm ERR! errno ENOENT
npm ERR! my-app#0.1.0 start: `react-scripts start`
npm ERR! spawn ENOENT
npm ERR!
npm ERR! Failed at the my-app#0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm WARN Local package.json exists, but node_modules missing, did you mean to install?
npm ERR! A complete log of this run can be found in:
npm ERR! /home/gaurav/.npm/_logs/2020-05-20T20_38_00_671Z-`enter code here`debug.log
[// This is my package.json]
{
"name": "my-app",
"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-icons": "^3.10.0",
"react-router-dom": "^5.2.0",
"react-scripts": "3.4.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"
]
}
}
This is happening everytime I try to start npm. It was working fine yesterday but it stopped totally.What should I do? What is missing in this package.json file? I also can't be able to install node modules.......!
You haven't installed all of your modules. Run npm install to install the modules specified in package.json and then npm start should work. Note from the error message that react-scripts is not found, which is your clue that the package is not installed
I have a very strange error when trying to create a react app using the create-react-app module. On my computer it is very easy to recreate the error:
npx create-react-app test-project --typescript
The project works fine. But if I delete the node_modules folder and do:
npm install
I get this error:
npm install
npm WARN deprecated flatten#1.0.2: I wrote this module a very long time ago; you should use something else.
npm WARN deprecated left-pad#1.3.0: use String.prototype.padStart()
npm ERR! Unexpected end of JSON input while parsing near '...3s4pkvleO6z4pcCFRth5v'
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/computer/.npm/_logs/2019-08-14T14_44_36_086Z-debug.log
Funny thing is, if I remove the "react-scripts" from the package.json file, npm install is succesfull - but of course the project doesn't work then.
I am using Node 12.8.0. And here are the package.json file:
{
"name": "test-project",
"version": "0.1.0",
"private": true,
"dependencies": {
"#types/jest": "24.0.17",
"#types/node": "12.7.1",
"#types/react": "16.9.1",
"#types/react-dom": "16.8.5",
"react": "^16.9.0",
"react-dom": "^16.9.0",
"react-scripts": "3.1.1",
"typescript": "3.5.3"
},
"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"
]
}
}
I solved this by running
npm cache clean --force
But if you want to check if it is a viable solution before nuking the entire cache you can do:
npm install --cache /tmp/empty-cache
It forces npm to not use the cache.
I clone your package.json and npm install work good
using node v11.14.0 and npm 6.7.0
I tried to clear this problem to use on the node v12.8.1.
But I could't solve it.
Finally, I down-graded node version to 10.16.3 LTS. :(
If you want to use 'create-react-app' that have no npm error, Just use node version 10.16.3 LTS.