I’m using a Boosted replit to run NUXT 3.0. I’m getting the message on my webview when I try to access it.
Do I need to buy cycles? My replit resources don’t seem to be used as much.
Appreciate your help.
1 Like
In the meantime also bought cycles and did more upgrades, without success.
I Changed my replit configuration file to be able to boot it using the run button, then I got to run it without the webview.
This seems to be a Nuxt.js error, not anything wrong with the Repl in particular. What happens if you delete the build folder and rebuild?
3 Likes
I removed .nuxt, node_modules and package-lock and started with a fresh install. No success.
Message seems to came from replit/devtools
The injected URL is https://94f2b423-7c65-4ff8-890a-cd4dd6e5ecb2.id.repl.co/__replco/devtools_wrapper.html
The Error seems to be coming from what is not part of Vue or Nuxt.
2 Likes
I tried to create a public repo with nuxt 3 ssr:true to test without any of my custom setup and still show upgrade required.
https://replit.com/@LucasSchirm/Nuxt-3-Basic-Setup
Also add this, since other people seems to be going throught the same issue.
What happens when you update to node.js v18?
1 Like
Is actually already running on v18.12.1! The github post is not mine, is another person with the same issue.
Did you find anything else by any chance?
I’m sorry, I’m very unfamilliar with Nuxt.js. I’ll pass it along to someone who’s familliar with the stack.
cc @TheDrone7
1 Like
I got a response, there is an issue with ports. Make sure you’re exposing the host 0.0.0.0 with your application.
It’s an issue with the ports, nuxt runs 2 servers 1 for the actual site itself and one that actively builds the site for hmr and stuff. Replit often exposes the wrong port cuz the one that is needed to build the project starts first and displays “Upgrade required” and then even when the other server, which is the actual site starts, does not get exposed. (edited)
You can configure port exposing in Replit as shown here: https://docs.replit.com/programming-ide/configuring-repl#ports
1 Like
~/Nuxt-3-Basic-Setup$ netstat -tulpn | grep node
tcp 0 0 0.0.0.0:3000 0.0.0.0:* LISTEN 3563/node
tcp6 0 0 :::24678 :::* LISTEN 3563/node
Try setting the externalPort to 24678 and the localPort to 3000.
1 Like
Thank you will try it later today.
I got the netstat working, but couldn`t get it to look like yours.
I tried to set the host as on the RIGHT doc (Nuxt Configuration Reference · Nuxt) and also tried to use the script change below:
"dev": "nuxt dev --hostname '0.0.0.0' --port 3000",
When I run dev I get:
~/Nuxt-3-Basic-Setup$ netstat -tulpn | grep node
tcp6 0 0 :::3000 :::* LISTEN 112/node
tcp6 0 0 :::24678 :::* LISTEN 112/node
EDITED
I changed the HOST secret for the replit to 0.0.0.0
~/Nuxt-3-Basic-Setup$ netstat -tulpn | grep node
tcp 0 0 0.0.0.0:3000 0.0.0.0:* LISTEN 126/node
tcp6 0 0 :::24678 :::* LISTEN 126/node
But still get "Updated Required"on the webview and when I open the URL from regular browser.
Also tried to remove “node_modules” and package-lock.json after getting the right set for netstat
1 Like
TheDrone7 seemed to have gotten Nuxt to work in a Repl, in a direct fork of yours.
1 Like
Thank you for sharing @IroncladDev
IT WORKED! Thank you.
Saw that he added the doors as we spoke before on this thread, but the configuration was as below, for anyone trying to achive the same.
Edit your replit file:
[[ports]]
localPort = 24678
externalPort = 24678
Steps that I had to do:
- On the files context menu click on “Show hidden files”
- Open the replit file to edit
- Add doors configuration
- Open the shell script and type in “kill 1” to restart your replit.
2 Likes
that seems to get the nuxt page to load but hmr doesnt work. How do we expose port 24678 properly so hmr works?
From the docs, " Currently only ports 5900 , 8099 , 9000 are allowed as the externalPort"
I haven`t tried it to be honest, do you have a public replit you are using to test?
maybe change the nuxt.config.ts file
vite: {
server: {
hmr: {
port: 9000
}
}
}
And use an externalPort 9000 in .replit.