fix(ssr): transform class props (vitejs#6261)

poyoho · Dec 26, 2021 · 2e3fe59 · 2e3fe59
1 parent 1a6e2da
commit 2e3fe59
Show file tree

Hide file tree

Showing 2 changed files with 35 additions and 2 deletions.
diff --git a/packages/vite/src/node/ssr/__tests__/ssrTransform.spec.ts b/packages/vite/src/node/ssr/__tests__/ssrTransform.spec.ts
@@ -498,3 +498,34 @@ objRest()
     "
   `)
 })
+
+test('class props', async () => {
+  expect(
+    (
+      await ssrTransform(
+        `
+import { remove, add } from 'vue'
+
+class A {
+  remove = 1
+  add = null
+}
+`,
+        null,
+        null
+      )
+    ).code
+  ).toMatchInlineSnapshot(`
+    "
+    const __vite_ssr_import_0__ = await __vite_ssr_import__(\\"vue\\");
+
+
+    const add = __vite_ssr_import_0__.add;
+    const remove = __vite_ssr_import_0__.remove;
+    class A {
+      remove = 1
+      add = null
+    }
+    "
+  `)
+})
diff --git a/packages/vite/src/node/ssr/ssrTransform.ts b/packages/vite/src/node/ssr/ssrTransform.ts
@@ -180,6 +180,7 @@ export async function ssrTransform(
   // 3. convert references to import bindings & import.meta references
   walk(ast, {
     onIdentifier(id, parent, parentStack) {
+      const grandparent = parentStack[parentStack.length - 2]
       const binding = idToImportMap.get(id.name)
       if (!binding) {
         return
@@ -195,8 +196,9 @@ export async function ssrTransform(
           s.appendLeft(id.end, `: ${binding}`)
         }
       } else if (
-        parent.type === 'ClassDeclaration' &&
-        id === parent.superClass
+        (parent.type === 'PropertyDefinition' &&
+          grandparent?.type === 'ClassBody') ||
+        (parent.type === 'ClassDeclaration' && id === parent.superClass)
       ) {
         if (!declaredConst.has(id.name)) {
           declaredConst.add(id.name)