fix(compiler-sfc): use options module name if options provide runtime…

…ModuleName options (#10457)

close #10454

packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap

@@ -1362,3 +1362,24 @@ return { get foo() { return foo } }
 
 }"
 `;
+
+exports[`compileScript > should care about runtimeModuleName 1`] = `
+"import { withAsyncContext as _withAsyncContext } from "npm:vue"
+
+export default {
+ async setup(__props, { expose: __expose }) {
+ __expose();
+
+let __temp, __restore
+
+ ;(
+ ([__temp,__restore] = _withAsyncContext(() => Promise.resolve(1))),
+ await __temp,
+ __restore()
+)
+ 
+return { }
+}
+
+}"
+`;

packages/compiler-sfc/__tests__/compileScript.spec.ts

@@ -1472,3 +1472,26 @@ describe('SFC genDefaultAs', () => {
  })
  })
 })
+
+describe('compileScript', () => {
+ test('should care about runtimeModuleName', () => {
+ const { content } = compile(
+ `
+ <script setup>
+ await Promise.resolve(1)
+ </script>
+ `,
+ {
+ templateOptions: {
+ compilerOptions: {
+ runtimeModuleName: 'npm:vue',
+ },
+ },
+ },
+ )
+ expect(content).toMatch(
+ `import { withAsyncContext as _withAsyncContext } from "npm:vue"\n`,
+ )
+ assertCode(content)
+ })
+})

packages/compiler-sfc/src/compileScript.ts

@@ -989,10 +989,15 @@ export function compileScript(
 
  // 11. finalize Vue helper imports
  if (ctx.helperImports.size > 0) {
+ const runtimeModuleName =
+ options.templateOptions?.compilerOptions?.runtimeModuleName
+ const importSrc = runtimeModuleName
+ ? JSON.stringify(runtimeModuleName)
+ : `'vue'`
  ctx.s.prepend(
  `import { ${[...ctx.helperImports]
  .map(h => `${h} as _${h}`)
- .join(', ')} } from 'vue'\n`,
+ .join(', ')} } from ${importSrc}\n`,
  )
  }