root
/
vue3-core
mirror of https://github.com/vuejs/core.git
1
0
Fork 0
Code Issues Actions 12 Packages Projects Releases Wiki Activity

refactor(compiler-sfc): collapse genRuntimeProps logic

This commit is contained in:
Evan You 2023-04-11 14:06:54 +08:00
parent d0ac57872c
commit 9f5692e052
4 changed files with 144 additions and 138 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

39
packages/compiler-sfc/src/compileScript.ts
View File

@ -55,8 +55,7 @@ import { ScriptCompileContext } from './script/context'
import {
processDefineProps,
DEFINE_PROPS,
WITH_DEFAULTS,
extractRuntimeProps
WITH_DEFAULTS
} from './script/defineProps'
import {
resolveObjectKey,
@ -279,7 +278,7 @@ export function compileScript(
}
// metadata that needs to be returned
const bindingMetadata: BindingMetadata = {}
// const ctx.bindingMetadata: BindingMetadata = {}
const userImports: Record<string, ImportBinding> = Object.create(null)
const scriptBindings: Record<string, BindingTypes> = Object.create(null)
const setupBindings: Record<string, BindingTypes> = Object.create(null)
@ -1231,7 +1230,6 @@ export function compileScript(
}
// 4. extract runtime props/emits code from setup context type
extractRuntimeProps(ctx)
if (emitsTypeDecl) {
extractRuntimeEmits(emitsTypeDecl, typeDeclaredEmits, error)
}
@ -1265,31 +1263,28 @@ export function compileScript(
// 7. analyze binding metadata
if (scriptAst) {
Object.assign(bindingMetadata, analyzeScriptBindings(scriptAst.body))
Object.assign(ctx.bindingMetadata, analyzeScriptBindings(scriptAst.body))
}
if (ctx.propsRuntimeDecl) {
for (const key of getObjectOrArrayExpressionKeys(ctx.propsRuntimeDecl)) {
bindingMetadata[key] = BindingTypes.PROPS
ctx.bindingMetadata[key] = BindingTypes.PROPS
}
}
for (const key in ctx.typeDeclaredProps) {
bindingMetadata[key] = BindingTypes.PROPS
}
for (const key in ctx.modelDecls) {
bindingMetadata[key] = BindingTypes.PROPS
ctx.bindingMetadata[key] = BindingTypes.PROPS
}
// props aliases
if (ctx.propsDestructureDecl) {
if (ctx.propsDestructureRestId) {
bindingMetadata[ctx.propsDestructureRestId] =
ctx.bindingMetadata[ctx.propsDestructureRestId] =
BindingTypes.SETUP_REACTIVE_CONST
}
for (const key in ctx.propsDestructuredBindings) {
const { local } = ctx.propsDestructuredBindings[key]
if (local !== key) {
bindingMetadata[local] = BindingTypes.PROPS_ALIASED
;(bindingMetadata.__propsAliases ||
(bindingMetadata.__propsAliases = {}))[local] = key
ctx.bindingMetadata[local] = BindingTypes.PROPS_ALIASED
;(ctx.bindingMetadata.__propsAliases ||
(ctx.bindingMetadata.__propsAliases = {}))[local] = key
}
}
}
@ -1297,7 +1292,7 @@ export function compileScript(
userImports
)) {
if (isType) continue
bindingMetadata[key] =
ctx.bindingMetadata[key] =
imported === '*' ||
(imported === 'default' && source.endsWith('.vue')) ||
source === 'vue'
@ -1305,15 +1300,15 @@ export function compileScript(
: BindingTypes.SETUP_MAYBE_REF
}
for (const key in scriptBindings) {
bindingMetadata[key] = scriptBindings[key]
ctx.bindingMetadata[key] = scriptBindings[key]
}
for (const key in setupBindings) {
bindingMetadata[key] = setupBindings[key]
ctx.bindingMetadata[key] = setupBindings[key]
}
// known ref bindings
if (refBindings) {
for (const key of refBindings) {
bindingMetadata[key] = BindingTypes.SETUP_REF
ctx.bindingMetadata[key] = BindingTypes.SETUP_REF
}
}
@ -1327,7 +1322,7 @@ export function compileScript(
ctx.helperImports.add('unref')
s.prependLeft(
startOffset,
`\n${genCssVarsCode(cssVars, bindingMetadata, scopeId, isProd)}\n`
`\n${genCssVarsCode(cssVars, ctx.bindingMetadata, scopeId, isProd)}\n`
)
}
@ -1401,7 +1396,7 @@ export function compileScript(
// generate getter for import bindings
// skip vue imports since we know they will never change
returned += `get ${key}() { return ${key} }, `
} else if (bindingMetadata[key] === BindingTypes.SETUP_LET) {
} else if (ctx.bindingMetadata[key] === BindingTypes.SETUP_LET) {
// local let binding, also add setter
const setArg = key === 'v' ? `_v` : `v`
returned +=
@ -1434,7 +1429,7 @@ export function compileScript(
options.templateOptions.compilerOptions),
inline: true,
isTS,
bindingMetadata
bindingMetadata: ctx.bindingMetadata
}
})
if (tips.length) {
@ -1570,7 +1565,7 @@ export function compileScript(
return {
...scriptSetup,
bindings: bindingMetadata,
bindings: ctx.bindingMetadata,
imports: userImports,
content: s.toString(),
map: genSourceMap

23
packages/compiler-sfc/src/script/context.ts
View File

@ -3,12 +3,9 @@ import { SFCDescriptor } from '../parse'
import { generateCodeFrame } from '@vue/shared'
import { parse as babelParse, ParserOptions, ParserPlugin } from '@babel/parser'
import { SFCScriptCompileOptions } from '../compileScript'
import {
PropsDeclType,
PropTypeData,
PropsDestructureBindings
} from './defineProps'
import { PropsDeclType, PropsDestructureBindings } from './defineProps'
import { ModelDecl } from './defineModel'
import { BindingMetadata } from '../../../compiler-core/src'
export class ScriptCompileContext {
isJS: boolean
@ -23,12 +20,6 @@ export class ScriptCompileContext {
scriptStartOffset = this.descriptor.script?.loc.start.offset
scriptEndOffset = this.descriptor.script?.loc.end.offset
helperImports: Set<string> = new Set()
helper(key: string): string {
this.helperImports.add(key)
return `_${key}`
}
declaredTypes: Record<string, string[]> = Object.create(null)
// macros presence check
@ -49,11 +40,19 @@ export class ScriptCompileContext {
propsDestructuredBindings: PropsDestructureBindings = Object.create(null)
propsDestructureRestId: string | undefined
propsRuntimeDefaults: Node | undefined
typeDeclaredProps: Record<string, PropTypeData> = {}
// defineModel
modelDecls: Record<string, ModelDecl> = {}
// codegen
bindingMetadata: BindingMetadata = {}
helperImports: Set<string> = new Set()
helper(key: string): string {
this.helperImports.add(key)
return `_${key}`
}
constructor(
public descriptor: SFCDescriptor,
public options: SFCScriptCompileOptions

2
packages/compiler-sfc/src/script/defineModel.ts
View File

@ -9,7 +9,7 @@ export interface ModelDecl {
identifier: string | undefined
}
export function genModels(ctx: ScriptCompileContext) {
export function genModelProps(ctx: ScriptCompileContext) {
if (!ctx.hasDefineModelCall) return
const isProd = !!ctx.options.isProd

218
packages/compiler-sfc/src/script/defineProps.ts
View File

@ -9,7 +9,7 @@ import {
ObjectExpression,
Expression
} from '@babel/types'
import { isFunctionType } from '@vue/compiler-dom'
import { BindingTypes, isFunctionType } from '@vue/compiler-dom'
import { ScriptCompileContext } from './context'
import { inferRuntimeType, resolveQualifiedType } from './resolveType'
import {
@ -22,7 +22,7 @@ import {
unwrapTSNode,
toRuntimeTypeString
} from './utils'
import { genModels } from './defineModel'
import { genModelProps } from './defineModel'
export const DEFINE_PROPS = 'defineProps'
export const WITH_DEFAULTS = 'withDefaults'
@ -174,44 +174,6 @@ function processWithDefaults(
return true
}
export function extractRuntimeProps(ctx: ScriptCompileContext) {
const node = ctx.propsTypeDecl
if (!node) return
const members = node.type === 'TSTypeLiteral' ? node.members : node.body
for (const m of members) {
if (
(m.type === 'TSPropertySignature' || m.type === 'TSMethodSignature') &&
m.key.type === 'Identifier'
) {
let type: string[] | undefined
let skipCheck = false
if (m.type === 'TSMethodSignature') {
type = ['Function']
} else if (m.typeAnnotation) {
type = inferRuntimeType(
m.typeAnnotation.typeAnnotation,
ctx.declaredTypes
)
// skip check for result containing unknown types
if (type.includes(UNKNOWN_TYPE)) {
if (type.includes('Boolean') || type.includes('Function')) {
type = type.filter(t => t !== UNKNOWN_TYPE)
skipCheck = true
} else {
type = ['null']
}
}
}
ctx.typeDeclaredProps[m.key.name] = {
key: m.key.name,
required: !m.optional,
type: type || [`null`],
skipCheck
}
}
}
}
export function genRuntimeProps(ctx: ScriptCompileContext): string | undefined {
let propsDecls: undefined | string
if (ctx.propsRuntimeDecl) {
@ -234,10 +196,10 @@ export function genRuntimeProps(ctx: ScriptCompileContext): string | undefined {
}
}
} else if (ctx.propsTypeDecl) {
propsDecls = genPropsFromTS(ctx)
propsDecls = genRuntimePropsFromTypes(ctx)
}
const modelsDecls = genModels(ctx)
const modelsDecls = genModelProps(ctx)
if (propsDecls && modelsDecls) {
return `${ctx.helper('mergeModels')}(${propsDecls}, ${modelsDecls})`
@ -246,71 +208,61 @@ export function genRuntimeProps(ctx: ScriptCompileContext): string | undefined {
}
}
function genPropsFromTS(ctx: ScriptCompileContext) {
const keys = Object.keys(ctx.typeDeclaredProps)
if (!keys.length) return
function genRuntimePropsFromTypes(ctx: ScriptCompileContext) {
const propStrings: string[] = []
const hasStaticDefaults = hasStaticWithDefaults(ctx)
let propsDecls = `{
${keys
.map(key => {
let defaultString: string | undefined
const destructured = genDestructuredDefaultValue(
ctx,
key,
ctx.typeDeclaredProps[key].type
// this is only called if propsTypeDecl exists
const node = ctx.propsTypeDecl!
const members = node.type === 'TSTypeLiteral' ? node.members : node.body
for (const m of members) {
if (
(m.type === 'TSPropertySignature' || m.type === 'TSMethodSignature') &&
m.key.type === 'Identifier'
) {
const key = m.key.name
let type: string[] | undefined
let skipCheck = false
if (m.type === 'TSMethodSignature') {
type = ['Function']
} else if (m.typeAnnotation) {
type = inferRuntimeType(
m.typeAnnotation.typeAnnotation,
ctx.declaredTypes
)
if (destructured) {
defaultString = `default: ${destructured.valueString}${
destructured.needSkipFactory ? `, skipFactory: true` : ``
}`
} else if (hasStaticDefaults) {
const prop = (
ctx.propsRuntimeDefaults as ObjectExpression
).properties.find(node => {
if (node.type === 'SpreadElement') return false
return resolveObjectKey(node.key, node.computed) === key
}) as ObjectProperty | ObjectMethod
if (prop) {
if (prop.type === 'ObjectProperty') {
// prop has corresponding static default value
defaultString = `default: ${ctx.getString(prop.value)}`
} else {
defaultString = `${prop.async ? 'async ' : ''}${
prop.kind !== 'method' ? `${prop.kind} ` : ''
}default() ${ctx.getString(prop.body)}`
}
// skip check for result containing unknown types
if (type.includes(UNKNOWN_TYPE)) {
if (type.includes('Boolean') || type.includes('Function')) {
type = type.filter(t => t !== UNKNOWN_TYPE)
skipCheck = true
} else {
type = ['null']
}
}
}
const { type, required, skipCheck } = ctx.typeDeclaredProps[key]
if (!ctx.options.isProd) {
return `${key}: { ${concatStrings([
`type: ${toRuntimeTypeString(type)}`,
`required: ${required}`,
skipCheck && 'skipCheck: true',
defaultString
])} }`
} else if (
type.some(
el =>
el === 'Boolean' ||
((!hasStaticDefaults || defaultString) && el === 'Function')
)
) {
// #4783 for boolean, should keep the type
// #7111 for function, if default value exists or it's not static, should keep it
// in production
return `${key}: { ${concatStrings([
`type: ${toRuntimeTypeString(type)}`,
defaultString
])} }`
} else {
// production: checks are useless
return `${key}: ${defaultString ? `{ ${defaultString} }` : `{}`}`
}
})
.join(',\n ')}\n }`
propStrings.push(
genRuntimePropFromType(
ctx,
key,
!m.optional,
type || [`null`],
skipCheck,
hasStaticDefaults
)
)
// register bindings
ctx.bindingMetadata[key] = BindingTypes.PROPS
}
}
if (!propStrings.length) {
return
}
let propsDecls = `{
${propStrings.join(',\n ')}\n }`
if (ctx.propsRuntimeDefaults && !hasStaticDefaults) {
propsDecls = `${ctx.helper('mergeDefaults')}(${propsDecls}, ${ctx.getString(
@ -321,13 +273,73 @@ function genPropsFromTS(ctx: ScriptCompileContext) {
return propsDecls
}
function genRuntimePropFromType(
ctx: ScriptCompileContext,
key: string,
required: boolean,
type: string[],
skipCheck: boolean,
hasStaticDefaults: boolean
): string {
let defaultString: string | undefined
const destructured = genDestructuredDefaultValue(ctx, key, type)
if (destructured) {
defaultString = `default: ${destructured.valueString}${
destructured.needSkipFactory ? `, skipFactory: true` : ``
}`
} else if (hasStaticDefaults) {
const prop = (ctx.propsRuntimeDefaults as ObjectExpression).properties.find(
node => {
if (node.type === 'SpreadElement') return false
return resolveObjectKey(node.key, node.computed) === key
}
) as ObjectProperty | ObjectMethod
if (prop) {
if (prop.type === 'ObjectProperty') {
// prop has corresponding static default value
defaultString = `default: ${ctx.getString(prop.value)}`
} else {
defaultString = `${prop.async ? 'async ' : ''}${
prop.kind !== 'method' ? `${prop.kind} ` : ''
}default() ${ctx.getString(prop.body)}`
}
}
}
if (!ctx.options.isProd) {
return `${key}: { ${concatStrings([
`type: ${toRuntimeTypeString(type)}`,
`required: ${required}`,
skipCheck && 'skipCheck: true',
defaultString
])} }`
} else if (
type.some(
el =>
el === 'Boolean' ||
((!hasStaticDefaults || defaultString) && el === 'Function')
)
) {
// #4783 for boolean, should keep the type
// #7111 for function, if default value exists or it's not static, should keep it
// in production
return `${key}: { ${concatStrings([
`type: ${toRuntimeTypeString(type)}`,
defaultString
])} }`
} else {
// production: checks are useless
return `${key}: ${defaultString ? `{ ${defaultString} }` : `{}`}`
}
}
/**
* check defaults. If the default object is an object literal with only
* static properties, we can directly generate more optimized default
* declarations. Otherwise we will have to fallback to runtime merging.
*/
function hasStaticWithDefaults(ctx: ScriptCompileContext) {
return (
return !!(
ctx.propsRuntimeDefaults &&
ctx.propsRuntimeDefaults.type === 'ObjectExpression' &&
ctx.propsRuntimeDefaults.properties.every(