fix(ssr): fix ssr runtime helper import in module mode

vuejs · Sep 23, 2021 · 8e05b7f · 8e05b7f
1 parent 74a84ff
commit 8e05b7f
Show file tree

Hide file tree

Showing 4 changed files with 23 additions and 9 deletions.
diff --git a/packages/compiler-core/src/codegen.ts b/packages/compiler-core/src/codegen.ts
@@ -95,6 +95,7 @@ function createCodegenContext(
     optimizeImports = false,
     runtimeGlobalName = `Vue`,
     runtimeModuleName = `vue`,
+    ssrRuntimeModuleName = 'vue/server-renderer',
     ssr = false,
     isTS = false,
     inSSR = false
@@ -109,6 +110,7 @@ function createCodegenContext(
     optimizeImports,
     runtimeGlobalName,
     runtimeModuleName,
+    ssrRuntimeModuleName,
     ssr,
     isTS,
     inSSR,
@@ -319,7 +321,8 @@ function genFunctionPreamble(ast: RootNode, context: CodegenContext) {
     push,
     newline,
     runtimeModuleName,
-    runtimeGlobalName
+    runtimeGlobalName,
+    ssrRuntimeModuleName
   } = context
   const VueBinding =
     !__BROWSER__ && ssr
@@ -363,7 +366,7 @@ function genFunctionPreamble(ast: RootNode, context: CodegenContext) {
     push(
       `const { ${ast.ssrHelpers
         .map(aliasHelper)
-        .join(', ')} } = require("vue/server-renderer")\n`
+        .join(', ')} } = require("${ssrRuntimeModuleName}")\n`
     )
   }
   genHoists(ast.hoists, context)
@@ -377,7 +380,13 @@ function genModulePreamble(
   genScopeId: boolean,
   inline?: boolean
 ) {
-  const { push, newline, optimizeImports, runtimeModuleName } = context
+  const {
+    push,
+    newline,
+    optimizeImports,
+    runtimeModuleName,
+    ssrRuntimeModuleName
+  } = context
 
   if (genScopeId && ast.hoists.length) {
     ast.helpers.push(PUSH_SCOPE_ID, POP_SCOPE_ID)
@@ -414,7 +423,7 @@ function genModulePreamble(
     push(
       `import { ${ast.ssrHelpers
         .map(s => `${helperNameMap[s]} as _${helperNameMap[s]}`)
-        .join(', ')} } from "@vue/server-renderer"\n`
+        .join(', ')} } from "${ssrRuntimeModuleName}"\n`
     )
   }
 

diff --git a/packages/compiler-core/src/options.ts b/packages/compiler-core/src/options.ts
@@ -275,6 +275,11 @@ export interface CodegenOptions extends SharedTransformCodegenOptions {
    * @default 'vue'
    */
   runtimeModuleName?: string
+  /**
+   * Customize where to import ssr runtime helpers from/**
+   * @default 'vue/server-renderer'
+   */
+  ssrRuntimeModuleName?: string
   /**
    * Customize the global variable name of `Vue` to get helpers from
    * in function mode

diff --git a/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap b/packages/compiler-sfc/__tests__/__snapshots__/compileScript.spec.ts.snap
@@ -751,7 +751,7 @@ return (_ctx, _cache) => {
 
 exports[`SFC compile <script setup> inlineTemplate mode ssr codegen 1`] = `
 "import { useCssVars as _useCssVars, unref as _unref } from 'vue'
-import { ssrRenderAttrs as _ssrRenderAttrs, ssrInterpolate as _ssrInterpolate } from \\"@vue/server-renderer\\"
+import { ssrRenderAttrs as _ssrRenderAttrs, ssrInterpolate as _ssrInterpolate } from \\"vue/server-renderer\\"
 
 import { ref } from 'vue'
         

diff --git a/packages/compiler-ssr/__tests__/ssrScopeId.spec.ts b/packages/compiler-ssr/__tests__/ssrScopeId.spec.ts
@@ -10,7 +10,7 @@ describe('ssr: scopeId', () => {
         mode: 'module'
       }).code
     ).toMatchInlineSnapshot(`
-      "import { ssrRenderAttrs as _ssrRenderAttrs } from \\"@vue/server-renderer\\"
+      "import { ssrRenderAttrs as _ssrRenderAttrs } from \\"vue/server-renderer\\"
 
       export function ssrRender(_ctx, _push, _parent, _attrs) {
         _push(\`<div\${_ssrRenderAttrs(_attrs)} data-v-xxxxxxx><span data-v-xxxxxxx>hello</span></div>\`)
@@ -27,7 +27,7 @@ describe('ssr: scopeId', () => {
       }).code
     ).toMatchInlineSnapshot(`
       "import { resolveComponent as _resolveComponent, withCtx as _withCtx, createTextVNode as _createTextVNode } from \\"vue\\"
-      import { ssrRenderComponent as _ssrRenderComponent } from \\"@vue/server-renderer\\"
+      import { ssrRenderComponent as _ssrRenderComponent } from \\"vue/server-renderer\\"
 
       export function ssrRender(_ctx, _push, _parent, _attrs) {
         const _component_foo = _resolveComponent(\\"foo\\")
@@ -56,7 +56,7 @@ describe('ssr: scopeId', () => {
       }).code
     ).toMatchInlineSnapshot(`
       "import { resolveComponent as _resolveComponent, withCtx as _withCtx, createVNode as _createVNode } from \\"vue\\"
-      import { ssrRenderComponent as _ssrRenderComponent } from \\"@vue/server-renderer\\"
+      import { ssrRenderComponent as _ssrRenderComponent } from \\"vue/server-renderer\\"
 
       export function ssrRender(_ctx, _push, _parent, _attrs) {
         const _component_foo = _resolveComponent(\\"foo\\")
@@ -85,7 +85,7 @@ describe('ssr: scopeId', () => {
       }).code
     ).toMatchInlineSnapshot(`
       "import { resolveComponent as _resolveComponent, withCtx as _withCtx, createVNode as _createVNode } from \\"vue\\"
-      import { ssrRenderComponent as _ssrRenderComponent } from \\"@vue/server-renderer\\"
+      import { ssrRenderComponent as _ssrRenderComponent } from \\"vue/server-renderer\\"
 
       export function ssrRender(_ctx, _push, _parent, _attrs) {
         const _component_foo = _resolveComponent(\\"foo\\")