fix: respect vite base config for absolute URLs during dev

Author: yyx990803

packages/plugin-vue/src/template.ts

@@ -125,6 +125,7 @@ export function resolveTemplateCompilerOptions(
           (options.devServer.config.server?.origin ?? '') +
           devBase +
           slash(path.relative(options.root, path.dirname(filename))),
+        includeAbsolute: !!devBase,
       }
     }
   } else if (transformAssetUrls !== false) {

playground/vue-asset-base/Main.vue

@@ -0,0 +1,4 @@
+<template>
+  <img alt="Vue logo" src="./assets/asset.png" />
+  <img alt="Vue logo" src="/assets/asset.png" />
+</template>

playground/vue-asset-base/__tests__/vue-asset-base.spec.ts

@@ -0,0 +1,11 @@
+import { expect, test } from 'vitest'
+import { isBuild, page } from '~utils'
+
+test('should render', async () => {
+  const expected = isBuild
+    ? /^\/foo\/assets\/asset-[-\w]+\.png/
+    : /^\/foo\/assets\/asset.png/
+
+  expect(await page.getAttribute('img', 'src')).toMatch(expected)
+  expect(await page.getAttribute('img:nth-child(2)', 'src')).toMatch(expected)
+})

playground/vue-asset-base/assets/asset.png

@@ -0,0 +1 @@
+declare module '*.png'

playground/vue-asset-base/env.d.ts

@@ -0,0 +1,7 @@
+<div id="app"></div>
+<script type="module">
+  import { createApp, defineCustomElement } from 'vue'
+  import Main from './Main.vue'
+
+  createApp(Main).mount('#app')
+</script>

playground/vue-asset-base/index.html

@@ -0,0 +1,17 @@
+{
+  "name": "@vitejs/test-vue-server-origin",
+  "private": true,
+  "version": "0.0.0",
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "debug": "node --inspect-brk vite",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "vue": "^3.3.8"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "workspace:*"
+  }
+}

playground/vue-asset-base/package.json

@@ -0,0 +1,16 @@
+import { defineConfig } from 'vite'
+import vuePlugin from '@vitejs/plugin-vue'
+
+export default defineConfig({
+  base: '/foo/',
+  resolve: {
+    alias: {
+      '@': __dirname,
+    },
+  },
+  plugins: [vuePlugin()],
+  build: {
+    // to make tests faster
+    minify: false,
+  },
+})