fix: template src sourcemap source

packages/plugin-vue/src/index.ts

@@ -291,6 +291,8 @@ export default function vuePlugin(rawOptions: Options = {}): Plugin {
  options.value,
  this,
  ssr,
+ filename,
+ !!query.src,
  )
  } else if (query.type === 'style') {
  return transformStyle(

packages/plugin-vue/src/template.ts

@@ -17,6 +17,8 @@ export async function transformTemplateAsModule(
  options: ResolvedOptions,
  pluginContext: TransformPluginContext,
  ssr: boolean,
+ filename: string,
+ isSrc: boolean,
 ): Promise<{
  code: string
  map: any
@@ -35,6 +37,15 @@ export async function transformTemplateAsModule(
  })`
  }
 
+ if (result.map && isSrc) {
+ const vueFileIndex = result.map.sources.findIndex(
+ (source) => source === descriptor.filename,
+ )
+ if (vueFileIndex >= 0) {
+ result.map.sources[vueFileIndex] = filename
+ }
+ }
+
  return {
  code: returnCode,
  map: result.map,

playground/vue-sourcemap/Main.vue

@@ -7,6 +7,7 @@
  <SassWithImport />
  <Less />
  <SrcImport />
+ <SrcImportHtml />
  <NoScript />
  <NoTemplate />
 </template>
@@ -19,6 +20,7 @@ import Sass from './Sass.vue'
 import SassWithImport from './SassWithImport.vue'
 import Less from './Less.vue'
 import SrcImport from './src-import/SrcImport.vue'
+import SrcImportHtml from './src-import-html/SrcImportHtml.vue'
 import NoScript from './NoScript.vue'
 import NoTemplate from './NoTemplate.vue'
 </script>

playground/vue-sourcemap/__tests__/__snapshots__/vue-sourcemap.spec.ts.snap

@@ -289,6 +289,20 @@ exports[`serve:vue-sourcemap > src imported > serve-src-imported 1`] = `
 }
 `;
 
+exports[`serve:vue-sourcemap > src imported html > serve-html 1`] = `
+{
+ "mappings": ";;;wBAAA,oBAA8B,WAA3B,mBAAuB",
+ "sources": [
+ "src-import.html",
+ ],
+ "sourcesContent": [
+ "<p>&lt;src-import-html&gt;</p>
+",
+ ],
+ "version": 3,
+}
+`;
+
 exports[`serve:vue-sourcemap > src imported sass > serve-src-imported-sass 1`] = `
 {
  "mappings": "AAAA;EACE;;ACCF;EACE",

playground/vue-sourcemap/__tests__/vue-sourcemap.spec.ts

@@ -91,6 +91,18 @@ describe.runIf(isServe)('serve:vue-sourcemap', () => {
  )
  })
 
+ test('src imported html', async () => {
+ const res = await page.request.get(
+ new URL(
+ './src-import-html/src-import.html?import&vue&type=template&src=true&lang.js',
+ page.url(),
+ ).href,
+ )
+ const js = await res.text()
+ const map = extractSourcemap(js)
+ expect(formatSourcemapForSnapshot(map)).toMatchSnapshot('serve-html')
+ })
+
  test('no script', async () => {
  const res = await page.request.get(
  new URL('./NoScript.vue', page.url()).href,

playground/vue-sourcemap/src-import-html/SrcImportHtml.vue

@@ -0,0 +1,5 @@
+<template src="./src-import.html" />
+
+<script setup lang="ts">
+console.log('src-import-html')
+</script>

playground/vue-sourcemap/src-import-html/src-import.html

@@ -0,0 +1 @@
+<p>&lt;src-import-html&gt;</p>