duplicate CSS <link> with `renderBuiltUrl`

[lsdsjy]

Describe the bug

Specify renderBuiltUrl like this:

    renderBuiltUrl(filename, { hostType }) {
      if (hostType === 'js') {
        return { runtime: `'/' + ${JSON.stringify(filename)}` };
      }
    },

then dynamic imports can lead to CSS links duplicated. For example, in the reproduction:

If the prefix is just '/' then I can simply use base: '/'; but the real situation for me is more complicated, where the prefix is not determined at build time and sometimes it is '/', so 'base' is not an option here.

Reproduction

https://stackblitz.com/edit/vitejs-vite-cssjgy?file=vite.config.js

Steps to reproduce

npm run build && npm run preivew

System Info

vite@4.4.9

Used Package Manager

npm

Logs

No response

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• 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.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[bolt-new-by-stackblitz]

Start a new pull request in StackBlitz Codeflow.

• vitejs-vite-cssjgy (Open reproduction)

[sapphi-red]

This might be related to #13169.

[sapphi-red]

Yep, changing it to

return { runtime: `new URL('/' + ${JSON.stringify(filename)}, document.baseURI).href` };

works.

Closing as a duplicate of #13169 No it's not a dup 😅