From e02725665d1767a5bf4e9bb2d29acfee1c4e79bc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E4=B8=89=E5=92=B2=E6=99=BA=E5=AD=90=20Kevin=20Deng?= Date: Tue, 30 Jan 2024 22:21:59 +0800 Subject: [PATCH] fix(compiler-vapor): import helper with type check --- .../__tests__/__snapshots__/compile.spec.ts.snap | 2 +- packages/compiler-vapor/src/generate.ts | 2 +- packages/compiler-vapor/src/generators/directive.ts | 8 ++++---- packages/compiler-vapor/src/generators/prop.ts | 4 ++-- packages/compiler-vapor/src/ir.ts | 2 +- packages/compiler-vapor/src/transforms/vModel.ts | 4 ++-- packages/runtime-vapor/src/directive.ts | 4 ++++ packages/runtime-vapor/src/directives/vModel.ts | 6 ++++++ 8 files changed, 21 insertions(+), 11 deletions(-) diff --git a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap index dfde62475..7b66d766a 100644 --- a/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap +++ b/packages/compiler-vapor/__tests__/__snapshots__/compile.spec.ts.snap @@ -17,7 +17,7 @@ export function render(_ctx) { `; exports[`compile > custom directive > basic 1`] = ` -"import { template as _template, children as _children, resolveDirective("vTest") as _resolveDirective("vTest"), resolveDirective("vHello") as _resolveDirective("vHello"), withDirectives as _withDirectives } from 'vue/vapor'; +"import { template as _template, children as _children, resolveDirective as _resolveDirective, withDirectives as _withDirectives } from 'vue/vapor'; export function render(_ctx) { const t0 = _template("
") diff --git a/packages/compiler-vapor/src/generate.ts b/packages/compiler-vapor/src/generate.ts index 9910b3d28..ca1b9fcbc 100644 --- a/packages/compiler-vapor/src/generate.ts +++ b/packages/compiler-vapor/src/generate.ts @@ -67,7 +67,7 @@ export interface CodegenContext { helpers: Set vaporHelpers: Set helper(name: string): string - vaporHelper(name: string): string + vaporHelper(name: VaporHelper): string } function createCodegenContext(ir: RootIRNode, options: CodegenOptions) { diff --git a/packages/compiler-vapor/src/generators/directive.ts b/packages/compiler-vapor/src/generators/directive.ts index 2367bb8d9..b9cc8cf01 100644 --- a/packages/compiler-vapor/src/generators/directive.ts +++ b/packages/compiler-vapor/src/generators/directive.ts @@ -16,11 +16,11 @@ export function genWithDirective( return [ newline(), - ...call(vaporHelper('withDirectives'), [element], directives), + ...call(vaporHelper('withDirectives'), element, directives), ] function genDirective({ dir, builtin }: WithDirectiveIRNode): CodeFragment[] { - const NULL = ['void 0'] + const NULL = 'void 0' const directive = genDirective() const value = dir.exp @@ -39,7 +39,7 @@ export function genWithDirective( return multi(['[', ']', ', '], directive, value, argument, modifiers) - function genDirective(): CodeFragment[] { + function genDirective() { const { vaporHelper, options: { bindingMetadata }, @@ -56,7 +56,7 @@ export function genWithDirective( directiveExpression.ast = null return genExpression(directiveExpression, context) } else { - return [vaporHelper(`resolveDirective("${directiveReference}")`)] + return `${vaporHelper('resolveDirective')}("${directiveReference}")` } } } diff --git a/packages/compiler-vapor/src/generators/prop.ts b/packages/compiler-vapor/src/generators/prop.ts index 85af01ec4..0387d1049 100644 --- a/packages/compiler-vapor/src/generators/prop.ts +++ b/packages/compiler-vapor/src/generators/prop.ts @@ -1,5 +1,5 @@ import type { CodeFragment, CodegenContext } from '../generate' -import type { SetPropIRNode } from '../ir' +import type { SetPropIRNode, VaporHelper } from '../ir' import { genExpression } from './expression' import { isString } from '@vue/shared' @@ -16,7 +16,7 @@ export function genSetProp( if (isString(oper.key) || oper.key.isStatic) { const keyName = isString(oper.key) ? oper.key : oper.key.content - let helperName: string | undefined + let helperName: VaporHelper | undefined let omitKey = false if (keyName === 'class') { helperName = 'setClass' diff --git a/packages/compiler-vapor/src/ir.ts b/packages/compiler-vapor/src/ir.ts index a9c9d8f7c..ae57c6489 100644 --- a/packages/compiler-vapor/src/ir.ts +++ b/packages/compiler-vapor/src/ir.ts @@ -156,7 +156,7 @@ export interface WithDirectiveIRNode extends BaseIRNode { type: IRNodeTypes.WITH_DIRECTIVE element: number dir: VaporDirectiveNode - builtin?: string + builtin?: VaporHelper } export type IRNode = diff --git a/packages/compiler-vapor/src/transforms/vModel.ts b/packages/compiler-vapor/src/transforms/vModel.ts index d91a9e090..a4fe26f9a 100644 --- a/packages/compiler-vapor/src/transforms/vModel.ts +++ b/packages/compiler-vapor/src/transforms/vModel.ts @@ -13,7 +13,7 @@ import { isStaticArgOf, } from '@vue/compiler-dom' import type { DirectiveTransform } from '../transform' -import { IRNodeTypes } from '..' +import { IRNodeTypes, type VaporHelper } from '../ir' export const transformVModel: DirectiveTransform = (dir, node, context) => { const { exp, arg, loc } = dir @@ -61,7 +61,7 @@ export const transformVModel: DirectiveTransform = (dir, node, context) => { } const isComponent = node.tagType === ElementTypes.COMPONENT - let runtimeDirective: string | undefined + let runtimeDirective: VaporHelper | undefined if (isComponent) { if (dir.arg) diff --git a/packages/runtime-vapor/src/directive.ts b/packages/runtime-vapor/src/directive.ts index 228f751c8..68e2c43af 100644 --- a/packages/runtime-vapor/src/directive.ts +++ b/packages/runtime-vapor/src/directive.ts @@ -144,3 +144,7 @@ function callDirectiveHook( resetTracking() if (name !== 'beforeUpdate') binding.oldValue = binding.value } + +export function resolveDirective() { + // TODO +} diff --git a/packages/runtime-vapor/src/directives/vModel.ts b/packages/runtime-vapor/src/directives/vModel.ts index 2ce4ce5b6..7138989e8 100644 --- a/packages/runtime-vapor/src/directives/vModel.ts +++ b/packages/runtime-vapor/src/directives/vModel.ts @@ -98,3 +98,9 @@ export const vModelText: ObjectDirective< el.value = newValue }, } + +// TODO +export const vModelDynamic = {} +export const vModelRadio = {} +export const vModelCheckbox = {} +export const vModelSelect = {}