diff --git a/packages/playground/vue-jsx/__tests__/vue-jsx.spec.ts b/packages/playground/vue-jsx/__tests__/vue-jsx.spec.ts index 3a54cfdbf011e4..104d3bd52642b9 100644 --- a/packages/playground/vue-jsx/__tests__/vue-jsx.spec.ts +++ b/packages/playground/vue-jsx/__tests__/vue-jsx.spec.ts @@ -1,4 +1,4 @@ -import { editFile, isBuild, untilUpdated } from '../../testUtils' +import { editFile, isBuild, untilUpdated } from 'testUtils' test('should render', async () => { expect(await page.textContent('.named')).toMatch('0') @@ -25,9 +25,10 @@ if (!isBuild) { ) await untilUpdated(() => page.textContent('.named'), 'named updated 0') - // should not affect other components on the page - expect(await page.textContent('.named-specifier')).toMatch('2') - expect(await page.textContent('.default')).toMatch('3') + // affect all components in same file + expect(await page.textContent('.named-specifier')).toMatch('1') + expect(await page.textContent('.default')).toMatch('2') + // should not affect other components from different file expect(await page.textContent('.default-tsx')).toMatch('4') }) @@ -40,8 +41,9 @@ if (!isBuild) { 'named specifier updated 1' ) + // affect all components in same file + expect(await page.textContent('.default')).toMatch('2') // should not affect other components on the page - expect(await page.textContent('.default')).toMatch('3') expect(await page.textContent('.default-tsx')).toMatch('4') }) diff --git a/packages/plugin-vue-jsx/index.js b/packages/plugin-vue-jsx/index.js index 6e9546be103646..86d27be65008b2 100644 --- a/packages/plugin-vue-jsx/index.js +++ b/packages/plugin-vue-jsx/index.js @@ -62,7 +62,7 @@ function vueJsxPlugin(options = {}) { // check for hmr injection /** - * @type {{ name: string, hash: string }[]} + * @type {{ name: string }[]} */ const declaredComponents = [] /** @@ -70,7 +70,6 @@ function vueJsxPlugin(options = {}) { * local: string, * exported: string, * id: string, - * hash: string * }[]} */ const hotComponents = [] @@ -91,11 +90,10 @@ function vueJsxPlugin(options = {}) { ) { hotComponents.push( ...parseComponentDecls(node.declaration, code).map( - ({ name, hash: _hash }) => ({ + ({ name }) => ({ local: name, exported: name, - id: hash(id + name), - hash: _hash + id: hash(id + name) }) ) ) @@ -112,8 +110,7 @@ function vueJsxPlugin(options = {}) { hotComponents.push({ local: spec.local.name, exported: spec.exported.name, - id: hash(id + spec.exported.name), - hash: matched.hash + id: hash(id + spec.exported.name) }) } } @@ -131,8 +128,7 @@ function vueJsxPlugin(options = {}) { hotComponents.push({ local: node.declaration.name, exported: 'default', - id: hash(id + 'default'), - hash: matched.hash + id: hash(id + 'default') }) } } else if (isDefineComponentCall(node.declaration)) { @@ -140,10 +136,7 @@ function vueJsxPlugin(options = {}) { hotComponents.push({ local: '__default__', exported: 'default', - id: hash(id + 'default'), - hash: hash( - code.slice(node.declaration.start, node.declaration.end) - ) + id: hash(id + 'default') }) } } @@ -160,14 +153,11 @@ function vueJsxPlugin(options = {}) { } let callbackCode = `` - for (const { local, exported, id, hash } of hotComponents) { + for (const { local, exported, id } of hotComponents) { code += `\n${local}.__hmrId = "${id}"` + - `\n${local}.__hmrHash = "${hash}"` + `\n__VUE_HMR_RUNTIME__.createRecord("${id}", ${local})` - callbackCode += - `\n if (__${exported}.__hmrHash !== ${local}.__hmrHash) ` + - `__VUE_HMR_RUNTIME__.reload("${id}", __${exported})` + callbackCode += `\n__VUE_HMR_RUNTIME__.reload("${id}", __${exported})` } code += `\nimport.meta.hot.accept(({${hotComponents @@ -195,8 +185,7 @@ function parseComponentDecls(node, source) { for (const decl of node.declarations) { if (decl.id.type === 'Identifier' && isDefineComponentCall(decl.init)) { names.push({ - name: decl.id.name, - hash: hash(source.slice(decl.init.start, decl.init.end)) + name: decl.id.name }) } }