Complete newbie with React, and it seems so much more convoluted than anything i've experienced. the coding is easier than JavaScript. running the applications on the other hand... a complete nightmare...
Just followed a tutorial on youtube and actually managed to finish it without bugging out mid way. But 3 hours later, when I wanted to check out the project again. (just want to run the app in my browser and have a look) I go to vs code and open terminal and type in npm start (newb so idk anything, is this even what i should do? ) and it gives me this
"next start
ready - started server on 0.0.0.0:3000, url: http://localhost:3000
info - Using webpack 5. Reason: no next.config.js https://nextjs.org/docs/messages/webpack5
Error: Could not find a production build in the 'C:\Users\Eric\Downloads\New folder\portfolio_website-STARTER.next' directory. Try building your app with 'next build' before starting the production server. https://nextjs.org/docs/messages/production-start-no-build-id
at Server.readBuildId (C:\Users\Eric\Downloads\New folder\portfolio_website-STARTER\node_modules\next\dist\next-server\server\next-server.js:151:355)
at new Server (C:\Users\Eric\Downloads\New folder\portfolio_website-STARTER\node_modules\next\dist\next-server\server\next-server.js:3:120)
at NextServer.createServer (C:\Users\Eric\Downloads\New folder\portfolio_website-STARTER\node_modules\next\dist\server\next.js:1:2935)
at async C:\Users\Eric\Downloads\New folder\portfolio_website-STARTER\node_modules\next\dist\server\next.js:1:3360
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! portfolio_nextjs#0.1.0 start: next start
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the portfolio_nextjs#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:
npm ERR! C:\Users\Eric\AppData\Roaming\npm-cache_logs\2022-03-28T02_41_25_297Z-debug.log"
I can't even begin to decipher with all that was. this is why i'm having so much trouble with React, it's always a complete wall of text... can someone please explain what's going on?
Sorry i can't comment due to my low reputation but I'll be explaining Amadan's comment.
Try to read the error message. It literally says try building your app.
As newbies, we may be confused by the meaning of "build". You can refer this as "compile" for quick analogy. (for the sake of quick analogy as you may be familiar with compile)
The message itself recommend you to build your app with 'next build'. Try running the command 'next build' to your terminal and see what happen.
'npm start' (an alias for 'npm run start') itself may not include building the project first. Depending on your scripts in package.json file: you can try 'npm run build' (in case your tutorial includes this).
See the docs for more information: https://docs.npmjs.com/cli/v8/commands
Also read more about building apps: https://create-react-app.dev/docs/production-build
Related
I am trying to start a new sanity project, it keeps on failing, this is my first time using it, I have tried it on the command prompt and in my vscode terminal, always fail at exactly here:
PS C:\Users\USER\Documents\portfolio> cd .\backend_sanity
PS C:\Users\USER\Documents\portfolio\backend_sanity> npm create sanity#latest -- --coupon javascriptmastery2022
Coupon "javascriptmastery2022" validated!
You're setting up a new project!
We'll make sure you have an account with Sanity.io. Then we'll
install an open-source JS content editor that connects to
the real-time hosted API on Sanity.io. Hang on.
Press ctrl + C at any time to quit.
Prefer web interfaces to terminals?
You can also set up best practice Sanity projects with
your favorite frontends on https://www.sanity.io/templates
Looks like you already have a Sanity-account. Sweet!
✔ Fetching existing projects
? Project name: website
Your content will be stored in a dataset that can be public or private, depending on
whether you want to query your content with or without authentication.
The default dataset configuration has a public dataset named "production".
? Use the default dataset configuration? Yes
✔ Creating dataset
? Project output path: C:\Users\USER\Documents\portfolio\backend_sanity
? Select project template Clean project with no predefined schemas
? Do you want to use TypeScript? Yes
✔ Bootstrapping files from template
✔ Resolving latest module versions
✔ Creating default project files
? Package manager to use for installing dependencies? npm
Running 'npm install --legacy-peer-deps'
npm WARN deprecated sourcemap-codec#1.4.8: Please use #jridgewell/sourcemap-codec instead
npm ERR! code ERR_SOCKET_TIMEOUT
npm ERR! network Socket timeout
npm ERR! network This is a problem related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settings.
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' config is set properly. See: 'npm help config'
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\USER\AppData\Local\npm-cache\_logs\2023-01-01T14_05_15_828Z-debug-0.log
Error: Command failed with exit code 1 (Unknown system error -1): npm install --legacy-peer-deps
at makeError$1 (C:/Users/USER/AppData/Local/npm-cache/_npx/67a0730928194b24/node_modules/#sanity/cli/lib/_chunks/cli-0bbdf4ec.js:1614:1386)
at handlePromise (C:/Users/USER/AppData/Local/npm-cache/_npx/67a0730928194b24/node_modules/#sanity/cli/lib/_chunks/cli-0bbdf4ec.js:1694:959)
at async installDeclaredPackages (C:/Users/USER/AppData/Local/npm-cache/_npx/67a0730928194b24/node_modules/#sanity/cli/lib/_chunks/cli-0bbdf4ec.js:1694:4672)
at async initSanity (C:/Users/USER/AppData/Local/npm-cache/_npx/67a0730928194b24/node_modules/#sanity/cli/lib/_chunks/cli-0bbdf4ec.js:17019:4972)
PS C:\Users\USER\Documents\portfolio\backend_sanity>
I tried to start a sanity project, I ran the command to create and it fails at the last stage
I am new to backend. Just starting to make a To-Do app in react and was just setting up amazon aws for backend. Using this site for reference ( https://docs.amplify.aws/start/getting-started/setup/q/integration/react#initialize-a-new-backend ).
And at the point Install Amplify libraries I got stuck while i type npm install aws-amplify #aws-amplify/ui-react in root directory it shows me error everytime.[error pic][1] I am trying for a long but did not find any solution. Pls help me in this issue !!
[1]: https://i.stack.imgur.com/hrSeJ.png Here is the error i'm getting in command prompt👇
npm ERR! Unexpected end of JSON input while parsing near '...:"^1.0.0-beta.2","#aw'
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Aakash~1Bansal\AppData\Roaming\npm-cache\_logs\2021-04-09T11_41_43_000Z-debug.log
F:\Learning- tanay pratap\AWS\react-amplified>npm install aws-amplify #aws-amplify/ui-react
npm ERR! Unexpected end of JSON input while parsing near '...:"^1.0.0-beta.2","#aw'
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\Aakash~1Bansal\AppData\Roaming\npm-cache\_logs\2021-04-09T11_45_14_875Z-debug.log
F:\Learning- tanay pratap\AWS\react-amplified>
I was having the same issue. 1st make sure your PC is connected to internet connection. Run:
npm uninstall -g #aws-amplify/cli
npm install -g #aws-amplify/cli
If possible don't minimize the window wait till everything is properly install.
This worked for me.
Still you are facing problems then reinstall node.js and then do this.
Thank you!
Recently I was building a very basic react projector for learning reasons and I faced with a very annoying problem described by theses logs:
npm ERR! errno 1
npm ERR! react-tutorial-guide#0.1.0 eject: `react-scripts eject`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the react-tutorial-guide#0.1.0 eject 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! C:\Users\admin\AppData\Roaming\npm-cache\_logs\2021-01-09T22_43_29_500Z-debug.log
I did a quick search, spent a lot of hours I finally I found the problem.
There was some unstaged change in my projects so I should do:
git add .
git commit -am "some message"
to solve the problem, I did it and in the principle, the problem wasn't been solved. I saw more carefully my project and I could see that git local repositories outside my react projects folder was been considered as unstaged changes. So when I try to commit my project by the commands above, it failed and consequentially the problem wasn't been solved what doesn't make sense they were outside my project folder and I was inside my project folder when I executed the git commands to solve the problem.
I investigated more carefully to solve the problem, so I noted that My reacts project is inside a folder, where there is other react projects, and this React projects folder was inside the document user folder, to be more precise in this path on my os system (windows 10): C:\Users(USER_NAME)\Documents
To solve the problem I simply deleted the folder where there were local git repositories and finally I could execute the wanted task:
npm run eject
I know this solution is very bad, but it was the only one that I was able to do and it is too annoying because it will cause me future problem in the react projects where I have to execute
npm run eject
in my projects when it were needed. I'm finding a better solution and if someone could show me how to avoid this issue I would be too thankfully.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\admin\AppData\Roaming\npm-cache\_logs\2021-01-09T22_43_29_500Z-debug.log
In my opinion, it is not a problem with git. The error which you got is probably because of the way that you have installed the node or npm in your system. Maybe by updating the npm would have also solved your problem.
npm install -g npm
You can also download the latest version of node.js from the official site.
There is an another way of updating the node through node version manager(nvm). Please follow the instruction for installing or updating the nvm.
Im using two computers and want to sometimes develop on one computer and sometimes on another. But is it possible to develop the same react js app via two computers synching everything via dropbox so all the files stays in sync. Im getting this error when Im running npm start
sh: /Users/mycomputer/Dropbox/webb/myapp/node_modules/.bin/react-scripts: Permission denied
npm ERR! code ELIFECYCLE
npm ERR! errno 126
npm ERR! perottosson#0.1.0 start: `react-scripts start`
npm ERR! Exit status 126
npm ERR!
npm ERR! Failed at the perottosson#0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
For using code in multiple computer, definitely you can use version control tool like Github/Bitbucket.
But the error you are facing is different. As you are coping the node modules also from 1 computer to another it is creating issue as it might happen that both PC has different node & npm version.
So never commit node_modules folder. It is auto create folder which will download all the dependencies when you hit npm install. So I suggest you to delete node_modules and then hit npm install and then start the project through npm start
You should look into using a source control software such as Git. You can create a free account at https://github.com and store your project on there. This allows you to modify it from any computer that has access
Please use something like git for this purpose.
You also could make a git file sync over your dropbox.
This is my first attempt at learning react, and it's started terribly. I've gone through the instructions directed here: https://facebook.github.io/react/docs/installation.html on the "Create a New App" tab exactly. Haven't done anything differently.
I'm using node 8.1.3, and npm 5.0.4
(I've also tried downgrading node to 6.11 without success).
I don't get any errors at all during installation.
When I run npm start, I get this super unhelpful error:
Starting the development server...
events.js:182
throw er; // Unhandled 'error' event
^
Error: watch /var/phil-machine/Code/react/test1/public ENOSPC
at exports._errnoException (util.js:1022:11)
at FSWatcher.start (fs.js:1384:19)
at Object.fs.watch (fs.js:1410:11)
at createFsWatchInstance (/var/phil-machine/Code/react/test1/node_modules/chokidar/lib/nodefs-handler.js:37:15)
at setFsWatchListener (/var/phil-machine/Code/react/test1/node_modules/chokidar/lib/nodefs-handler.js:80:15)
at FSWatcher.NodeFsHandler._watchWithNodeFs (/var/phil-machine/Code/react/test1/node_modules/chokidar/lib/nodefs-handler.js:228:14)
at FSWatcher.NodeFsHandler._handleDir (/var/phil-machine/Code/react/test1/node_modules/chokidar/lib/nodefs-handler.js:407:19)
at FSWatcher.<anonymous> (/var/phil-machine/Code/react/test1/node_modules/chokidar/lib/nodefs-handler.js:455:19)
at FSWatcher.<anonymous> (/var/phil-machine/Code/react/test1/node_modules/chokidar/lib/nodefs-handler.js:460:16)
at FSReqWrap.oncomplete (fs.js:153:5)
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! test1#0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the test1#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:
npm ERR! /home/phil/.npm/_logs/2017-07-05T23_52_25_652Z-debug.log
I'm at a loss. I've googled it (as best as I can - I'm not even sure what to google apart from the generic "react start error"), and got this answer https://stackoverflow.com/a/39960890/1569591 but that didn't help either.
When I run npm start it brings up the above error, and opens the bowser with a "Site cant be reached" error.
Can anyone help point me in the direction of how to fix this?
I've also tried changing the start command to use a different port:
PORT=3001 react-scripts start
Didn't work either.
Looks like an issue with node, ENOSPC means that there is no space on the drive.
Perhaps /tmp is full? You can configure npm to use a different temp folder by setting npm config set tmp /path/to/some/other/dir, or maybe delete everything out of the /tmp folder.
Source: ENOSPC in npm's repo in github.
I'm not entirely sure if this was the issue, but I've got it working.
It turns out another service, Grafana was using localhost port 3000. I removed Grafana and it still failed. After rebooting it appeared to work.
Again, I'm not sure if this will solve it 100% if others have the same problem, but this is what solved it for me.
I don't know which Operating System you are using but if you are using Fedora or CentOS try disabling selinux.
I had similar issue, but after disabling selinux it started working perfectly.