Next.js Discord

Discord Forum

Can't access /public

Answered
Sokoke posted this in #help-forum
Open in Discord
Avatar
SokokeOP
Hey guys,

As you can see I can't figure how to deal with getting static images from the /public with Internalization (next.js 14 app router).

I tried :

"@/public/blog/default-blog-cover.png";
"/public/blog/default-blog-cover.png";
"/blog/default-blog-cover.png";

Any idea how can I fix that ?

Thanks
Image
Answered by D Trombett
use a relative path instead
View full answer

7 Replies

Avatar
D Trombett
If @/ is configured as src/ then you can't use it to import public as it's outside the src folder
Avatar
D Trombett
use a relative path instead
Answer
Avatar
joulev
You can just put the image file in the same folder as the JavaScript file importing it too. It being in the public folder is not required.
Avatar
SokokeOP
Yes I'm using src/ thanks ! I made it work by replacing the url with this (see screenshot) but isn't it ugly and not the best way when in prod?
Image
Sure but the import will be in a component (in /components) isn't bad practice to put images inside a component folder?
Avatar
joulev
It comes down to personal preference but I’d rather collocate related resources in the same place. If it is only needed in one place, it should also be in that place. No point following “components should only contain components” if you have to end up with ../../../public, that doesn’t make any sense.
Avatar
SokokeOP
Okay I see thanks for your help !