diff --git a/packages/plugin-vue-jsx/src/index.ts b/packages/plugin-vue-jsx/src/index.ts index 1074b00f..0ca5cebe 100644 --- a/packages/plugin-vue-jsx/src/index.ts +++ b/packages/plugin-vue-jsx/src/index.ts @@ -158,14 +158,17 @@ function vueJsxPlugin(options: Options = {}): Plugin { enter( _path: babel.NodePath, ) { + const unwrappedDeclaration = unwrapTypeAssertion( + _path.node.declaration, + ) if ( isDefineComponentCall( - _path.node.declaration, + unwrappedDeclaration, defineComponentName, ) ) { - const declaration = _path.node - .declaration as types.CallExpression + const declaration = + unwrappedDeclaration as types.CallExpression const nodesPath = _path.replaceWithMultiple([ // const __default__ = defineComponent(...) types.variableDeclaration('const', [ @@ -276,7 +279,10 @@ function vueJsxPlugin(options: Options = {}): Plugin { }) } } else if ( - isDefineComponentCall(node.declaration, defineComponentName) + isDefineComponentCall( + unwrapTypeAssertion(node.declaration), + defineComponentName, + ) ) { hotComponents.push({ local: '__default__', @@ -337,7 +343,7 @@ function parseComponentDecls( for (const decl of node.declarations) { if ( decl.id.type === 'Identifier' && - isDefineComponentCall(decl.init, fnNames) + isDefineComponentCall(unwrapTypeAssertion(decl.init), fnNames) ) { names.push(decl.id.name) } @@ -357,6 +363,25 @@ function isDefineComponentCall( ) } +function unwrapTypeAssertion(node: types.Node): types.Node +function unwrapTypeAssertion( + node: types.Node | null | undefined, +): types.Node | null | undefined +function unwrapTypeAssertion( + node: types.Node | null | undefined, +): types.Node | null | undefined { + if (!node) return node + let current = node + while ( + current.type === 'TSAsExpression' || + current.type === 'TSSatisfiesExpression' || + current.type === 'TSTypeAssertion' + ) { + current = current.expression + } + return current +} + function getHash(text: string) { return crypto.hash('sha256', text, 'hex').substring(0, 8) } diff --git a/playground/vue-jsx/ExportDefaultAs.tsx b/playground/vue-jsx/ExportDefaultAs.tsx new file mode 100644 index 00000000..63b9d3a0 --- /dev/null +++ b/playground/vue-jsx/ExportDefaultAs.tsx @@ -0,0 +1,9 @@ +import { type DefineComponent, defineComponent } from 'vue' + +export default defineComponent({ + render() { + return ( + export default defineComponent as + ) + }, +}) as DefineComponent diff --git a/playground/vue-jsx/__tests__/vue-jsx.spec.ts b/playground/vue-jsx/__tests__/vue-jsx.spec.ts index b2e96d2b..4dbc8331 100644 --- a/playground/vue-jsx/__tests__/vue-jsx.spec.ts +++ b/playground/vue-jsx/__tests__/vue-jsx.spec.ts @@ -14,6 +14,9 @@ test('should render', async () => { expect(await page.textContent('.export-default')).toMatch( 'export default defineComponent', ) + expect(await page.textContent('.export-default-as')).toMatch( + 'export default defineComponent as', + ) }) test('should update', async () => { diff --git a/playground/vue-jsx/main.jsx b/playground/vue-jsx/main.jsx index e8414322..1c20bcb2 100644 --- a/playground/vue-jsx/main.jsx +++ b/playground/vue-jsx/main.jsx @@ -9,6 +9,7 @@ import JsxSetupSyntax from './setup-syntax-jsx.vue' import JsxWithQuery from './Query.jsx?query=true' import TsImport from './TsImport.vue' import ExportDefault from './ExportDefault' +import ExportDefaultAs from './ExportDefaultAs' function App() { return ( @@ -24,6 +25,7 @@ function App() { + ) }