Issue on vite-ssr build for img tag

[copongcopong]

I have a template that has an img tag ... (the images are inside /public/assets/images/ folder)

<template>
  <p>Logo here <img src="/assets/images/logo.png" />
</template>

It works on dev, however during build (vite-ssr build) I am getting a Rollup resolve error ...

[vite]: Rollup failed to resolve import "/assets/images/logo.png" from "src/pages/About.vue".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
`build.rollupOptions.external`

I'm not sure if this is just a configuration issue for vite-ssr.

If there are no image/img in my <template> build just works.

[copongcopong]

works for images inside /src/assets/images/ and call like <img src="@/assets/images/logo.png" />

[frandiox]

I found the issue but looks like a bug in Vite itself. The problem happens when building with Vite option publicDir: false.
In SSR we don't need to copy the public directory.

You can override that option with something like this:

// vite.config.js plugins

    viteSSR({
      build: {
        serverOptions: {
          publicDir: 'public',
        },
      },
    })

That will copy a bunch of files to dist/server that you can ignore.

[copongcopong]

i'll try this one. 👍

[jeanfrancoisgb]

@copongcopong Any update?

I tried it, but doesn't work. Did you manage to find a solution?

[frandiox]

@jeanfrancoisgb Just saw this. A bit late but there was a mistake in my previous post. Instead of true it should be the name of the directory ('public')