简而言之，就是先转化成AST树，再得到的render函数返回VNode(Vue的虚拟DOM节点)

详情步骤：

首先，通过compile编译器把template编译成AST语法树(abstract syntax tree 即源代码的抽象语法结构的树状表现形式)，compile是createCompiler的返回值，createCompiler是用以创建编译器的。另外compile还负责合并option；

然后，AST会经过generate(将AST语法树转化成render function字符串的过程)得到render函数，render的返回值是VNode，VNode是Vue的虚拟DOM节点，里面有（标签名、子节点、文本等等）；

对vue.js的template编译的理解的更多相关文章

  1. 聊聊Vue.js的template编译

    写在前面 因为对Vue.js很感兴趣,而且平时工作的技术栈也是Vue.js,这几个月花了些时间研究学习了一下Vue.js源码,并做了总结与输出. 文章的原地址:https://github.com/a ...

  2. Vue.js：template

    ylbtech-Vue.js: 1.返回顶部   2.返回顶部   3.返回顶部   4.返回顶部   5.返回顶部     6.返回顶部   7.返回顶部   8.返回顶部   9.返回顶部   1 ...

  3. 你应该要知道的vue.js

    前言 小组同事最近都在学习前端,目前我们小组前端技术栈主要是vue.在和同事交流过程成,发现他们对vue都不了解,所以整理了问的比较多的问题. 组件data为什么必须是函数? 因为组件可能被多处使用, ...

  4. vue.js面试题整理

    Vue.js面试题整理 一.什么是MVVM? MVVM是Model-View-ViewModel的缩写.MVVM是一种设计思想.Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务 ...

  5. web前端开发面试题（Vue.js）

    1.active-class是哪个组件的属性?嵌套路由怎么定义? 答:vue-router模块的router-link组件. 2.怎么定义vue-router的动态路由?怎么获取传过来的动态参数?  ...

  6. Vue.js面试题整理（转载）

    一.什么是MVVM? MVVM是Model-View-ViewModel的缩写.MVVM是一种设计思想.Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑:View 代表UI ...

  7. [ 转载 ] vue.js面试题一

    转载自:https://www.cnblogs.com/aimeeblogs/p/9501490.html 如有侵权 联系删除 Vue.js面试题整理 一.什么是MVVM? MVVM是Model-Vi ...

  8. Vue.js面试题

    一.什么是MVVM? MVVM是Model-View-ViewModel的缩写.MVVM是一种设计思想.Model 层代表数据模型,也可以在Model中定义数据修改和操作的业务逻辑:View 代表UI ...

  9. 从template到DOM(Vue.js源码角度看内部运行机制)

    写在前面 这篇文章算是对最近写的一系列Vue.js源码的文章(https://github.com/answershuto/learnVue)的总结吧,在阅读源码的过程中也确实受益匪浅,希望自己的这些 ...

随机推荐

  1. JavaScript高级用法三之浏览器对象

    综述 本篇的主要内容来自慕课网,内置对象,主要内容如下 1 window对象 2 JavaScript 计时器 3 计时器setInterval() 4 取消计时器clearInterval() 5 ...

  2. Java8学习笔记（三）--方法引入

    基本概念 格式 实例变量名 | 类名 :: 静态方法 | 实例方法 作用 简化Lambda表达式 示例 a -> System.out.println(a); <=> System. ...

  3. sublime text plugins

    Sublime Text 插件,HTML+CSS+JAVASCRIPT+JSON快速格式化:  htmlpretty 快捷键:Ctrl+Shift+H Essential Sublime Text 2 ...

  4. bootstrap入门基础

    1.字体 text-left text-center text-right text-lowercase 小写 text-uppercase 大写 text-capitalize 首字母大写 2.表格 ...

  5. java遇见的问题分析

    下面就一些java的一些基本问题进行解释.其中蓝色部分为handsomecui的主观看法 一.synchronized(obj)里面的参数怎么解释? synchronized的参数代表的是“对象锁”代 ...

  6. 01简单工厂模式SimpleFactory

    一.什么是简单工厂模式 简单工厂模式属于类的创建型模式,又叫做静态 工厂方法模式.通过专门定义一个类来负责创建 其他类的实例,被创建的实例通常都具有共同的 父类. 二.模式中包含的角色及其职责 1.工 ...

  7. 关于rem适配的3种常用封装

    在之前写了一篇关于rem适配的文章,但是没有给出具体的封装,那么今天这里给出常用的三种方法,分享出来供大家参考学习,下面话不多说了,来随着小编一起学习学习吧 一.rem1.js 第一种方法考虑了m端屏 ...

  8. PDF to image

    http://www.verypdf.com/pdf2tif/pdf-to-image/help.htm http://www.softinterface.com/DL/DL_Alternate_Do ...

  9. Centos 解决SSH 免密码登录 以及Crontab制作定时SSH自动登录和关闭的脚本

    一.SSH免密码登录 假设要登录的机器为192.168.1.100,当前登录的机器为192.168.1.101. 首先在101的机器上生成密钥(如果已经生成可以跳过): $ ssh-keygen -t ...

  10. OpenCV 1.0在VC6下安装与配置（附测试程序）

    步骤: 1 安装Visual C++ 6.0         2 安装OpenCV 1.0        3 配置Windows环境变量         4 配置Visual C++ 6.0     ...