I have a Vue app that outputs the following in the console after npm run serve.
DONE Compiled successfully in 17450ms 2:15:55 PM
App running at:
- Local: http://localhost:8080/
- Network: http://10.0.0.72:8080/
Note that the development build is not optimized.
To create a production build, run npm run build.
No issues found.
However, the app will not load on http://localhost:8080/ . The page displays the "This site cannot be reached.The connection was reset." message.
Other pages load fine, including the Node server I am using for the backend, running on localhost:3002.
I have tried removing the node_modules and running npm install again, but that hasn't fixed it. With the app compiling ok there is little help troubleshoot. There are also no errors in the browser dev tools console.
Does anyone know what might be going wrong or how to debug this?
Thanks!
change your port with npm run serve --hostname 0.0.0.0 --port 4000 and then run again.
Related
I've recently built a project using create-react-app. Everything is fine until today.
I run npm start as usual and try to visit http://localhost:3000. But I got LOCALHOST REFUSED CONNECTION error. And I got this on terminal's output in vscode.
Local: http://localhost:3000
On Your Network: http://172.24.194.157:3000
I made a small test: using vite to create a react app and npm run dev. And it's just fine to visit http://localhost:5173.
At first I thought it might be a problem with port. But turns out not. Because http://172.24.194.157:3000 is ok to develop my react-app.
So I guess, my browser resolute localhost to 127.0.0.1, but 127.0.0.1:3000 is not available due to react-scripts start serve the app on 172.24.194.157:3000.
But WHY is that happen? I made no changes to any config.(though I didn't open this project for about 2 weeks). It would be a great help if anyone can answer this. Thanks!
ENV INFO:
wsl1 in windows 11 (Ubuntu 20.04)
node: v16.9.0
npm: 8.19.3
I'm using create-react-app for generating a react.js project. It automatically implements a service-worker for progressive web app funtionality if a production build was made by using the command npm run build.
Two weeks ago everything worked fine and I was able to cache all files with the generated service-worker. But since today I always get errors:
On Chrome: Uncaught (in promise) Error: Request for http://localhost:5000/index.html?_sw-precache=aee80fca0f83208cc4d82ae2ccfda3c1 returned a response with status 301 at service-worker.js:1.
On Firefox: Service worker event waitUntil() was passed a promise that rejected with 'TypeError: NetworkError when attempting to fetch resource.'.
I have absolutely not idea why the error occurs.
Even if I create a new app and don't touch any of the generated files, the error shows up in the browsers console.
Steps to reproduce:
npx create-react-app my-app
cd my-app
npm run build
serve -s build
open app in browser
I tested it on two separate machines but get the same result. Any help is very appreciated.
Edit:
Console output after running npm run build:
C:PATH-TO-PROJECT>npm run build
> frontend#0.1.0 build C:\xampp\htdocs\gitlab\BA\App-PWA-progetraenke.app\frontend
> react-scripts build
Creating an optimized production build...
Compiled successfully.
File sizes after gzip:
164.04 KB build\static\js\main.d2519277.js
781 B build\static\css\main.77261875.css
The project was built assuming it is hosted at the server root.
You can control this with the homepage field in your package.json.
For example, add this to build it for GitHub Pages:
"homepage" : "http://myname.github.io/myapp",
The build folder is ready to be deployed.
You may serve it with a static server:
serve -s build
Find out more about deployment here:
https://github.com/facebook/create-react-app/blob/master/packages/react-scripts/template/README.md#deployment
I had the same issue with a VueJS app I created by using the PWA template of Vue. What did the trick for me was updating to the latest version of vue-cli and serve.
Updating to the latest serve version (8.1.4) probably solved my problem.
I am running vue cli project using command yarn run dev it compile successfully, but does not show any output on browser on localhost:8080 link, can’t establish a connection to the server at localhost:8080. error displayed.
Not any manual port set programmatically.enter image description here
I've been working on a project using React.js
It used to work fine on localhost:3000 but suddenly this has stopped working.
The commands I did before was
sudo npm run bundle
sudo npm start
And then my project was running. But now it says localhost refused connection. Message in the console:
"Failed to load resource: net::ERR_CONNECTION_REFUSED". Any ideas why?
I have checked that localhost:3000 not occupied
I have checked that Im working in the correct folder and all files seems * to be present
I have checked that Im using the latest npm and node version
You don't say what OS you are using but if it is MacOS or Linux you might want to check what $HOST is set to.
See How to start a react app with a custom host and port
I've got a simple Meteor app running on a Nitrous box. I'd like to be able to use node-inspector for server-side debugging (as described here), but I'm unable to get to the console.
My Meteor app is running locally on the box at http://0.0.0.0:3000/, and I can view it in Chrome by following the guide here. When I then run node-inspector, I get this message:
Node Inspector v0.8.3
Visit http://127.0.0.1:8080/debug?port=5858 to start debugging.
How can I get to this address? I've tried:
Navigating to https://example-name.example-region.nitrous.io:8080/debug?port=5858
Running: node-inspector --web-host 0.0.0.0
Running: node-inspector --web-host https://example-name.example-region.nitrous.io
Thoughts? Is there a way I can get to this console?
You should change the url on the box,
usually you just run the box running the meteor command
cd workspace
cd myAPP
meteor
and it works, but now you should run this commands.
cd workspace
cd myApp
ROOT_URL=http://machinename.abc1-2.nitrousbox.com meteor
Now run again node-inspector
you should get something like
Visit http://machinename.abc1-2.nitrousbox.com:8080/debug?port=5858 to start debugging.