From c84601cee5232bad0f65c8fcc663e38bb457a0b3 Mon Sep 17 00:00:00 2001
From: yoho <907415276@qq.com>
Date: Wed, 23 Feb 2022 23:53:19 +0800
Subject: [PATCH] fix(plugin-vue): setup jsx script no hmr (#6568)
---
.../vue-jsx/__tests__/vue-jsx.spec.ts | 7 +++++++
packages/playground/vue-jsx/main.jsx | 3 ++-
.../playground/vue-jsx/setup-syntax-jsx.vue | 17 +++++++++++++++++
packages/plugin-vue/src/handleHotUpdate.ts | 9 +++++++--
4 files changed, 33 insertions(+), 3 deletions(-)
create mode 100644 packages/playground/vue-jsx/setup-syntax-jsx.vue
diff --git a/packages/playground/vue-jsx/__tests__/vue-jsx.spec.ts b/packages/playground/vue-jsx/__tests__/vue-jsx.spec.ts
index b929f61fe965c3..64327e64a5f263 100644
--- a/packages/playground/vue-jsx/__tests__/vue-jsx.spec.ts
+++ b/packages/playground/vue-jsx/__tests__/vue-jsx.spec.ts
@@ -102,4 +102,11 @@ if (!isBuild) {
expect(await page.textContent('.script')).toMatch('5')
})
+
+ test('hmr: setup jsx in .vue', async () => {
+ editFile('setup-syntax-jsx.vue', (code) =>
+ code.replace('let count = ref(100)', 'let count = ref(1000)')
+ )
+ await untilUpdated(() => page.textContent('.setup-jsx'), '1000')
+ })
}
diff --git a/packages/playground/vue-jsx/main.jsx b/packages/playground/vue-jsx/main.jsx
index 200702c2cc69a1..1a792ea55d2a3c 100644
--- a/packages/playground/vue-jsx/main.jsx
+++ b/packages/playground/vue-jsx/main.jsx
@@ -4,7 +4,7 @@ import { default as TsxDefault } from './Comp'
import OtherExt from './OtherExt.tesx'
import JsxScript from './Script.vue'
import JsxSrcImport from './SrcImport.vue'
-
+import JsxSetupSyntax from './setup-syntax-jsx.vue'
function App() {
return (
<>
@@ -15,6 +15,7 @@ function App() {
+
>
)
}
diff --git a/packages/playground/vue-jsx/setup-syntax-jsx.vue b/packages/playground/vue-jsx/setup-syntax-jsx.vue
new file mode 100644
index 00000000000000..0b16be7e773280
--- /dev/null
+++ b/packages/playground/vue-jsx/setup-syntax-jsx.vue
@@ -0,0 +1,17 @@
+
+
+
+ {{ count }}
+
+
diff --git a/packages/plugin-vue/src/handleHotUpdate.ts b/packages/plugin-vue/src/handleHotUpdate.ts
index 2bce3950563367..7c2a7ef7ee2f1f 100644
--- a/packages/plugin-vue/src/handleHotUpdate.ts
+++ b/packages/plugin-vue/src/handleHotUpdate.ts
@@ -40,9 +40,14 @@ export async function handleHotUpdate(
if (hasScriptChanged(prevDescriptor, descriptor)) {
let scriptModule: ModuleNode | undefined
- if (descriptor.script?.lang && !descriptor.script.src) {
+ if (
+ (descriptor.scriptSetup?.lang && !descriptor.scriptSetup.src) ||
+ (descriptor.script?.lang && !descriptor.script.src)
+ ) {
const scriptModuleRE = new RegExp(
- `type=script.*&lang\.${descriptor.script.lang}$`
+ `type=script.*&lang\.${
+ descriptor.scriptSetup?.lang || descriptor.script?.lang
+ }$`
)
scriptModule = modules.find((m) => scriptModuleRE.test(m.url))
}