`@vitejs/plugin-vue` SSR not working properly with `build.rollupOptions.external`

[AaronBeaudoin]

Describe the bug

Suppose I have a minimal App.vue like this:

<template>
  <img src="/test">
</template>

The URL /test is not a module in my project but an image I'd like to just trust will be there at runtime in production. To do this, build.rollupOptions.external seems to be what I would want. So I set the option to simply ["/test"].

When I then build my project with npm run build, I get this SSR output (run reproduction for complete output):

import { useSSRContext, mergeProps, createSSRApp } from "vue";
import { ssrRenderAttrs, renderToString } from "vue/server-renderer";
import _imports_0 from "../../../../../../test"; // <-- What in the world is this?

...

function _sfc_ssrRender(_ctx, _push, _parent, _attrs) {
  _push(`<img${ssrRenderAttrs(mergeProps({ src: _imports_0 }, _attrs))}>`);
}

This is totally not what I would want/expect. In the Vue SFC Playground this is the complete output I get:

const __sfc__ = {}
import { mergeProps as _mergeProps } from "vue"
import { ssrRenderAttrs as _ssrRenderAttrs } from "vue/server-renderer"
function ssrRender(_ctx, _push, _parent, _attrs) {
  _push(`<img${_ssrRenderAttrs(_mergeProps({ src: "/test" }, _attrs))}>`)
}
__sfc__.ssrRender = ssrRender
__sfc__.__file = "App.vue"
export default __sfc__

The key difference is:

mergeProps({ src: "/test" }, _attrs) // <-- CORRECT

Versus:

import _imports_0 from "../../../../../../test"; // <-- WTF?
mergeProps({ src: _imports_0 }, _attrs)

Reproduction

https://github.com/AaronBeaudoin/vite-plugin-vue-issue-external

System Info

System:
    OS: macOS 12.5
    CPU: (10) arm64 Apple M1 Pro
    Memory: 82.14 MB / 16.00 GB
    Shell: 5.8.1 - /bin/zsh
  Binaries:
    Node: 16.17.0 - ~/.volta/tools/image/node/16.17.0/bin/node
    npm: 8.15.0 - ~/.volta/tools/image/node/16.17.0/bin/npm
  Browsers:
    Chrome: 105.0.5195.125
    Safari: 15.6
  npmPackages:
    @vitejs/plugin-vue: ^3.1.0 => 3.1.0 
    vite: ^3.0.4 => 3.0.4

Used Package Manager

npm

Logs

No response

Validations

• [X] Follow our Code of Conduct
• [X] Read the Contributing Guidelines.
• [X] Read the docs.
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• [X] The provided reproduction is a minimal reproducible example of the bug.

[brillout]

@AaronBeaudoin I guess a workaround would be to use a variable that holds the value /test? Ugly, but works.

[AaronBeaudoin]

That's what I've been doing.

[AaronBeaudoin]

Does "has workaround" mean "target release version: never"?

[brillout]

@AaronBeaudoin I can't speak for the Vite team but in my experience it means that the priority is lower which makes sense, so that Vite can focus on more important tickets first. It's also my experience that well written PRs get merged swiftly. To sum up: PR welcome 😉.

[edison1105]

Closing as it can't reproduce with the follow versions:

 "devDependencies": {
    "vite": "5.4.7"
  },
  "dependencies": {
    "@vitejs/plugin-vue": "5.1.4"
  }