From abfe3b47588e566a89d73df418103da0421d7cf4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90?= Date: Mon, 26 Sep 2022 11:13:26 +0800 Subject: [PATCH] fix: get render start in vue 2 directive (#518) --- src/core/transforms/directive/vue2.ts | 21 +++++++++++++-------- 1 file changed, 13 insertions(+), 8 deletions(-) diff --git a/src/core/transforms/directive/vue2.ts b/src/core/transforms/directive/vue2.ts index 5953cd77..78a7c03a 100644 --- a/src/core/transforms/directive/vue2.ts +++ b/src/core/transforms/directive/vue2.ts @@ -1,8 +1,7 @@ import type { - BlockStatement, CallExpression, File, FunctionExpression, Node, ObjectProperty, VariableDeclaration, + BlockStatement, CallExpression, FunctionExpression, Node, ObjectProperty, Program, VariableDeclaration, } from '@babel/types' import type MagicString from 'magic-string' -import type { ParseResult } from '@babel/parser' import { importModule, isPackageExists } from 'local-pkg' import type { ResolveResult } from '../../transformer' @@ -11,8 +10,8 @@ import type { ResolveResult } from '../../transformer' * @param ast * @returns */ -const getRenderFnStart = (ast: ParseResult): number => { - const renderFn = ast.program.body.find((node): node is VariableDeclaration => +const getRenderFnStart = (program: Program): number => { + const renderFn = program.body.find((node): node is VariableDeclaration => node.type === 'VariableDeclaration' && node.declarations[0].id.type === 'Identifier' && ['render', '_sfc_render'].includes(node.declarations[0].id.name), @@ -28,13 +27,13 @@ export default async function resolveVue2(code: string, s: MagicString): Promise throw new Error('[unplugin-vue-components:directive] To use Vue 2 directive you will need to install Babel first: "npm install -D @babel/parser"') const { parse } = await importModule('@babel/parser') - const ast = parse(code, { + const { program } = parse(code, { sourceType: 'module', }) const nodes: CallExpression[] = [] const { walk } = await import('estree-walker') - walk(ast.program as any, { + walk(program as any, { enter(node: any) { if ((node as Node).type === 'CallExpression') nodes.push(node) @@ -44,8 +43,14 @@ export default async function resolveVue2(code: string, s: MagicString): Promise if (nodes.length === 0) return [] + let _renderStart: number | undefined + const getRenderStart = () => { + if (_renderStart !== undefined) + return _renderStart + return (_renderStart = getRenderFnStart(program)) + } + const results: ResolveResult[] = [] - const renderStart = getRenderFnStart(ast) for (const node of nodes) { const { callee, arguments: args } = node // _c(_, {}) @@ -80,7 +85,7 @@ export default async function resolveVue2(code: string, s: MagicString): Promise results.push({ rawName: name, replace: (resolved) => { - s.prependLeft(renderStart!, `\nthis.$options.directives["${name}"] = ${resolved};`) + s.prependLeft(getRenderStart(), `\nthis.$options.directives["${name}"] = ${resolved};`) }, }) }