诗号:六道同坠,魔劫万千,引渡如来。

/img/bdx/yiyeshu-001.jpg

本文内容主要讲述的是 compiler-core 中模板解析过程中涉及到的各种表达式。比如: <div/> 最后被解析成什么 ast 结构,最后又被生成怎么样的 render 函数的一整个流程详 解。通过该文当你看到一个 HTML 模板的时候你的脑海里应该能浮现最后 render 函数大 概样子,或者你应该能具备了根据模板手写 render 函数的能力。

本文涉及的源码包: compiler-core

所有类型:

类型声明: compiler-core/src/ast.ts:NodeTypes

TypeDescription
ROOT-
ELEMENT-
TEXT-
COMMENT-
SIMPLE_EXPRESSION-
INTERPOLATIONinterpolation node
ATTRIBUTEproperty of element
containers:-
COMPOUND_EXPRESSIONcompound expression
IFv-if
IF_BRANCHv-else, v-else-if
FORv-for
TEXT_CALL-
JS_CALL_EXPRESSION-
JS_OBJECT_EXPRESSION-
JS_PROPERTY-
JS_ARRAY_EXPRESSION-
JS_FUNCTION_EXPRESSION-
JS_CONDITIONAL_EXPRESSION-
JS_CACHE_EXPRESSION-
ssr codegen-
JS_BLOCK_STATEMENT-
JS_TEMPLATE_LITERAL-
JS_IF_STATEMENT-
JS_ASSIGNMENT_EXPRESSION-
JS_SEQUENCE_EXPRESSION-
JS_RETURN_STATEMENT-

TODO