vue怎么编译template？

1.将 模板字符串 转换成 element ASTs（解析器）

#####一是,截取 字符串
#####二是,对截取之后的字符串做 解析

2.对 AST 进行静态节点标记，主要用来做虚拟DOM的渲染优化（优化器）

#####用递归的方式将所有节点添加 static 属性，标识是不是静态节点
#####标记所有静态根节点

3.使用 element ASTs 生成 render 函数代码字符串（代码生成器）

通过递归去拼一个函数执行代码的字符串，递归的过程根据不同的节点类型调用不同的生成方法，如果发现是一颗元素节点就拼一个 _c(tagName, data, children) 的函数调用字符串，然后 data 和 children 也是使用 AST 中的属性去拼字符串。如果 children 中还有 children 则递归去拼。

解析器（parser）的原理是一小段一小段的去截取字符串，然后维护一个 stack 用来保存DOM深度，每截取到一段标签的开始就 push 到 stack 中，当所有字符串都截取完之后也就解析出了一个完整的 AST。

优化器（optimizer）的原理是用递归的方式将所有节点打标记，表示是否是一个 静态节点，然后再次递归一遍把 静态根节点 也标记出来。

代码生成器（code generator）的原理也是通过递归去拼一个函数执行代码的字符串，递归的过程根据不同的节点类型调用不同的生成方法，如果发现是一颗元素节点就拼一个 _c(tagName, data, children) 的函数调用字符串，然后 data 和 children 也是使用 AST 中的属性去拼字符串。

最后拼出一个完整的 render 函数代码。