images are not displayed when app is not installed in web root.

[skang]

Steps to reproduce

step 1: modify "next.config.js" as below to install app to a different path:

....
module.exports = {
basePath: "/apps/materio",
...

step 2: run "npm run build"
step 3: run "npm run export"
step 4: publish app to web server (mine is powered by "nginx") by copying "out" folder to directory that maps to url path of "/apps/materio"

What is expected?

access materio app with URL: "https://localhost/apps/materio/index.html", it should work without problem. Specifically all components with images should display properly.

What is actually happening?

images in components of Materio app do not show up.

Additional data

[neelbrahmakshatriya]

Hi @skang,

This might be solved by adding the basePath in your images before making a production build.

For example, if you have written /images/my-image.png as your image source, you must update this path as /apps/materio/images/my-image.png. Another method is to set an environment variable in your .env file like BASE_PATH=/apps/materio and update image paths as:

`${process.env.BASE_PATH}/images/my-image.png`

We have not used the second method, but it probably should work.

You may refer to the official Next.js docs on the basePath.

Please let me if you have any further queries.

[github-actions]

This issue has been automatically marked as stale because it has no recent activity. It will be closed if no further activity occurs. Thank you for raising the concern.

[github-actions]

This issue has been automatically marked as closed because it has no recent activity.