When I'm developing locally the images are found when I place the /public
folder in /src/
:
# locally
./src/public/images/
Then when I do a deploy the images are not found. But when I place the public folder outside of src the images are found:
# deploy
./public/images/
./src/
And I use the images as:
<img src="/images/my-image.jpg" alt="" />
Is there a configuration setting I have to use?
Edit:
Full structure:
|- .now/
| |- project.json
| └── README.txt
|- next.config.js
|- now.json
|- src/
| |- .next/
| | |- build-manifest.json
| | |- react-loadable-manifest.json
| | |- cache/
| | |- server/
| | └── static/
| |- pages/
| └── next-env.d.ts
Best Solution
The public folder has to be in the root. There’s no way to configure otherwise.
Files inside public can then be referenced by your code starting from the base URL (/).
/public/path/image.jpg
is served as/path/image.jpg
https://nextjs.org/docs/basic-features/static-file-serving