diff --git a/packages/compiler-ssr/__tests__/ssrVShow.spec.ts b/packages/compiler-ssr/__tests__/ssrVShow.spec.ts
index d0f3ec930..d06e2c9d7 100644
--- a/packages/compiler-ssr/__tests__/ssrVShow.spec.ts
+++ b/packages/compiler-ssr/__tests__/ssrVShow.spec.ts
@@ -11,9 +11,9 @@ describe('ssr: v-show', () => {
const { ssrRenderAttrs: _ssrRenderAttrs } = require("vue/server-renderer")
return function ssrRender(_ctx, _push, _parent, _attrs) {
- _push(\`
\`)
+ }))}>\`)
}"
`)
})
@@ -92,6 +92,24 @@ describe('ssr: v-show', () => {
`)
})
+ test('with style + display', () => {
+ expect(compileWithWrapper(``).code)
+ .toMatchInlineSnapshot(`
+ "const { ssrRenderStyle: _ssrRenderStyle, ssrRenderAttrs: _ssrRenderAttrs } = require("vue/server-renderer")
+
+ return function ssrRender(_ctx, _push, _parent, _attrs) {
+ _push(\`\`)
+ }"
+ `)
+ })
+
test('with v-bind', () => {
expect(
compileWithWrapper(
diff --git a/packages/compiler-ssr/src/transforms/ssrTransformElement.ts b/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
index 4a12b0f7b..ee46894f9 100644
--- a/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
+++ b/packages/compiler-ssr/src/transforms/ssrTransformElement.ts
@@ -88,6 +88,17 @@ export const ssrTransformElement: NodeTransform = (node, context) => {
const hasCustomDir = node.props.some(
p => p.type === NodeTypes.DIRECTIVE && !isBuiltInDirective(p.name),
)
+
+ // v-show has a higher priority in ssr
+ const vShowPropIndex = node.props.findIndex(
+ i => i.type === NodeTypes.DIRECTIVE && i.name === 'show',
+ )
+ if (vShowPropIndex !== -1) {
+ const vShowProp = node.props[vShowPropIndex]
+ node.props.splice(vShowPropIndex, 1)
+ node.props.push(vShowProp)
+ }
+
const needMergeProps = hasDynamicVBind || hasCustomDir
if (needMergeProps) {
const { props, directives } = buildProps(