fix(ssr): fix class/style rendering + ssrRenderComponent export name

packages/compiler-ssr/__tests__/ssrElement.spec.ts

@@ -77,7 +77,7 @@ describe('ssr: element', () => {
       expect(
         getCompiledString(`<div id="foo" :class="bar"></div>`)
       ).toMatchInlineSnapshot(
-        `"\`<div id=\\"foo\\"\${_ssrRenderClass(_ctx.bar)}></div>\`"`
+        `"\`<div id=\\"foo\\" class=\\"\${_ssrRenderClass(_ctx.bar)}\\"></div>\`"`
       )
     })
 
@@ -85,7 +85,7 @@ describe('ssr: element', () => {
       expect(
         getCompiledString(`<div class="foo" :class="bar"></div>`)
       ).toMatchInlineSnapshot(
-        `"\`<div\${_ssrRenderClass([_ctx.bar, \\"foo\\"])}></div>\`"`
+        `"\`<div class=\\"\${_ssrRenderClass([_ctx.bar, \\"foo\\"])}\\"></div>\`"`
       )
     })
 
@@ -93,7 +93,7 @@ describe('ssr: element', () => {
       expect(
         getCompiledString(`<div id="foo" :style="bar"></div>`)
       ).toMatchInlineSnapshot(
-        `"\`<div id=\\"foo\\"\${_ssrRenderStyle(_ctx.bar)}></div>\`"`
+        `"\`<div id=\\"foo\\" style=\\"\${_ssrRenderStyle(_ctx.bar)}\\"></div>\`"`
       )
     })
 
@@ -101,7 +101,7 @@ describe('ssr: element', () => {
       expect(
         getCompiledString(`<div style="color:red;" :style="bar"></div>`)
       ).toMatchInlineSnapshot(
-        `"\`<div\${_ssrRenderStyle([_hoisted_1, _ctx.bar])}></div>\`"`
+        `"\`<div style=\\"\${_ssrRenderStyle([_hoisted_1, _ctx.bar])}\\"></div>\`"`
       )
     })
 

packages/compiler-ssr/src/transforms/ssrTransformElement.ts

@@ -176,10 +176,12 @@ export const ssrTransformElement: NodeTransform = (node, context) => {
                   // static key attr
                   if (attrName === 'class') {
                     openTag.push(
+                      ` class="`,
                       (dynamicClassBinding = createCallExpression(
                         context.helper(SSR_RENDER_CLASS),
                         [value]
-                      ))
+                      )),
+                      `"`
                     )
                   } else if (attrName === 'style') {
                     if (dynamicStyleBinding) {
@@ -187,10 +189,12 @@ export const ssrTransformElement: NodeTransform = (node, context) => {
                       mergeCall(dynamicStyleBinding, value)
                     } else {
                       openTag.push(
+                        ` style="`,
                         (dynamicStyleBinding = createCallExpression(
                           context.helper(SSR_RENDER_STYLE),
                           [value]
-                        ))
+                        )),
+                        `"`
                       )
                     }
                   } else {

packages/server-renderer/src/index.ts

@@ -2,7 +2,7 @@
 export { renderToString } from './renderToString'
 
 // internal runtime helpers
-export { renderComponent } from './renderToString'
+export { renderComponent as ssrRenderComponent } from './renderToString'
 export { ssrRenderSlot } from './helpers/ssrRenderSlot'
 export {
   ssrRenderClass,