模板解析阶段（整体运行流程）

解析器的作用是将我们在<template></template>标签中写的模板根据一系列特定的规则解析成抽象语法树（AST）

在我们写的模板当中，除了有常规的HTML标签外，还会有一些文本信息以及在文本信息中包含的过滤器。这些不同的内容在解析起来需要不同的解析规则，所以在解析器内部，也被拆成了几个小解析器，有解析常规HTML的HTML解析器、解析文本的文本解析器和解析过滤器的过滤器解析器。

整体运行流程

既然有解析器内部有多个小解析器，那么整体的运行流程是什么？

由于文本过滤器和过滤器解析器都是存在HTML解析器中，所以整体运行流程是这样的，先使用HTML解析器解析模板，如果遇到文本就用文本过滤器解析，如果文本中遇到过滤器就使用过滤器解析器解析。

回归Vue源码中，我们可以整理出如下简化代码，完整源码在/src/complier/parser/index.js

export function parse(template, options) {
   // ...
  parseHTML(template, {
    // ...
    start (tag, attrs, unary) {
      // 每当解析到标签的开始位置时，触发该函数
    },
    end () {
      // 每当解析到标签的结束位置时，触发该函数
    },
    chars (text: string) {
      // 每当解析到文本时，触发该函数
      parseText(text)
    },
    comment (text: string) {
      // 每当解析到注释时，触发该函数
    }
  })
  return root
}
成功

从上述代码中，我们可以看出，parse 函数就是解析器的主函数，在parse 函数内调用了parseHTML 函数对模板字符串进行解析，在parseHTML 函数解析模板字符串的过程中，如果遇到文本信息，就会调用文本解析器parseText函数进行文本解析；如果遇到文本中包含过滤器，就会调用过滤器解析器parseFilters函数进行解析。

总结

本小节梳理了模板解析阶段的整体运行流程。

模板解析就是将用户所写模板通过一系列特定的规则解析出来，根据所使用的规则，我们可以将其分为解析常规HTML的HTML解析器、解析文本的文本解析器和解析过滤器的过滤器解析器。

在解析过程中，先使用HTML解析器解析模板，如果遇到文本就用文本过滤器解析，如果文本中遇到过滤器就使用过滤器解析器解析。最终完成整个解析流程。