fix(compiler-vapor): import helper with type check

This commit is contained in:
三咲智子 Kevin Deng 2024-01-30 22:21:59 +08:00
parent 7f8a94b48e
commit e02725665d
No known key found for this signature in database
GPG Key ID: 69992F2250DFD93E
8 changed files with 21 additions and 11 deletions

View File

@ -17,7 +17,7 @@ export function render(_ctx) {
`; `;
exports[`compile > custom directive > basic 1`] = ` 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) { export function render(_ctx) {
const t0 = _template("<div></div>") const t0 = _template("<div></div>")

View File

@ -67,7 +67,7 @@ export interface CodegenContext {
helpers: Set<string> helpers: Set<string>
vaporHelpers: Set<string> vaporHelpers: Set<string>
helper(name: string): string helper(name: string): string
vaporHelper(name: string): string vaporHelper(name: VaporHelper): string
} }
function createCodegenContext(ir: RootIRNode, options: CodegenOptions) { function createCodegenContext(ir: RootIRNode, options: CodegenOptions) {

View File

@ -16,11 +16,11 @@ export function genWithDirective(
return [ return [
newline(), newline(),
...call(vaporHelper('withDirectives'), [element], directives), ...call(vaporHelper('withDirectives'), element, directives),
] ]
function genDirective({ dir, builtin }: WithDirectiveIRNode): CodeFragment[] { function genDirective({ dir, builtin }: WithDirectiveIRNode): CodeFragment[] {
const NULL = ['void 0'] const NULL = 'void 0'
const directive = genDirective() const directive = genDirective()
const value = dir.exp const value = dir.exp
@ -39,7 +39,7 @@ export function genWithDirective(
return multi(['[', ']', ', '], directive, value, argument, modifiers) return multi(['[', ']', ', '], directive, value, argument, modifiers)
function genDirective(): CodeFragment[] { function genDirective() {
const { const {
vaporHelper, vaporHelper,
options: { bindingMetadata }, options: { bindingMetadata },
@ -56,7 +56,7 @@ export function genWithDirective(
directiveExpression.ast = null directiveExpression.ast = null
return genExpression(directiveExpression, context) return genExpression(directiveExpression, context)
} else { } else {
return [vaporHelper(`resolveDirective("${directiveReference}")`)] return `${vaporHelper('resolveDirective')}("${directiveReference}")`
} }
} }
} }

View File

@ -1,5 +1,5 @@
import type { CodeFragment, CodegenContext } from '../generate' import type { CodeFragment, CodegenContext } from '../generate'
import type { SetPropIRNode } from '../ir' import type { SetPropIRNode, VaporHelper } from '../ir'
import { genExpression } from './expression' import { genExpression } from './expression'
import { isString } from '@vue/shared' import { isString } from '@vue/shared'
@ -16,7 +16,7 @@ export function genSetProp(
if (isString(oper.key) || oper.key.isStatic) { if (isString(oper.key) || oper.key.isStatic) {
const keyName = isString(oper.key) ? oper.key : oper.key.content const keyName = isString(oper.key) ? oper.key : oper.key.content
let helperName: string | undefined let helperName: VaporHelper | undefined
let omitKey = false let omitKey = false
if (keyName === 'class') { if (keyName === 'class') {
helperName = 'setClass' helperName = 'setClass'

View File

@ -156,7 +156,7 @@ export interface WithDirectiveIRNode extends BaseIRNode {
type: IRNodeTypes.WITH_DIRECTIVE type: IRNodeTypes.WITH_DIRECTIVE
element: number element: number
dir: VaporDirectiveNode dir: VaporDirectiveNode
builtin?: string builtin?: VaporHelper
} }
export type IRNode = export type IRNode =

View File

@ -13,7 +13,7 @@ import {
isStaticArgOf, isStaticArgOf,
} from '@vue/compiler-dom' } from '@vue/compiler-dom'
import type { DirectiveTransform } from '../transform' import type { DirectiveTransform } from '../transform'
import { IRNodeTypes } from '..' import { IRNodeTypes, type VaporHelper } from '../ir'
export const transformVModel: DirectiveTransform = (dir, node, context) => { export const transformVModel: DirectiveTransform = (dir, node, context) => {
const { exp, arg, loc } = dir const { exp, arg, loc } = dir
@ -61,7 +61,7 @@ export const transformVModel: DirectiveTransform = (dir, node, context) => {
} }
const isComponent = node.tagType === ElementTypes.COMPONENT const isComponent = node.tagType === ElementTypes.COMPONENT
let runtimeDirective: string | undefined let runtimeDirective: VaporHelper | undefined
if (isComponent) { if (isComponent) {
if (dir.arg) if (dir.arg)

View File

@ -144,3 +144,7 @@ function callDirectiveHook(
resetTracking() resetTracking()
if (name !== 'beforeUpdate') binding.oldValue = binding.value if (name !== 'beforeUpdate') binding.oldValue = binding.value
} }
export function resolveDirective() {
// TODO
}

View File

@ -98,3 +98,9 @@ export const vModelText: ObjectDirective<
el.value = newValue el.value = newValue
}, },
} }
// TODO
export const vModelDynamic = {}
export const vModelRadio = {}
export const vModelCheckbox = {}
export const vModelSelect = {}