Next.js Website
Unanswered
Orange-tailed bumble bee posted this in #help-forum
Orange-tailed bumble beeOP
So I created a website through a tutorial to learn more about script. I'm just wondering why does my website look broken when I open it through a html file
20 Replies
Orange-tailed bumble beeOP
running npm start and opening the website through localhost looks like this
@Orange-tailed bumble bee are you using Next.js?
@Orange-tailed bumble bee So I created a website through a tutorial to learn more about script. I'm just wondering why does my website look broken when I open it through a html file
it's the same reason as you get a blank page when you open index.html of create-react-app project
@Orange-tailed bumble bee So I created a website through a tutorial to learn more about script. I'm just wondering why does my website look broken when I open it through a html file
nextjs is meant to be served with the http:// or the https:// protocols. it doesn't work when you just directly visit the html file (file:// protocol).
if you are using static export, you need to use something like
if you are using static export, you need to use something like
serve
https://github.com/vercel/serve to serve the built html files. or just upload to static hosting services which will do it for you.@James4u <@494880165365678090> are you using Next.js?
Orange-tailed bumble beeOP
yes
@joulev nextjs is meant to be served with the http:// or the https:// protocols. it doesn't work when you just directly visit the html file (file:// protocol).
if you are using static export, you need to use something like `serve` <https://github.com/vercel/serve> to serve the built html files. or just upload to static hosting services which will do it for you.
Orange-tailed bumble beeOP
Alright so it should be fine when i host it on hostinger?
should be, yes
Orange-tailed bumble beeOP
alright thank you
@joulev should be, yes
Orange-tailed bumble beeOP
I'm sorry for bothering you I have one more question 🙈
go for it
Orange-tailed bumble beeOP
So, the website is up and running on hostinger
but the images are not working
idk if thats some problem that was created when i ran npm run build
or something
im confused
inspect the images
Orange-tailed bumble beeOP
alr
@Orange-tailed bumble bee Click to see attachment
Use the unoptimized prop for the <Image /> component
Image optimisation doesn’t work without a nodejs server. So it isn’t supported in static export.