发表于 | 阅读次数
| 字数统计 330 | 阅读时长 1

不得不吐槽一句，vue的源码竟然是用ts语言写的。可怜我等小前端看的迷迷糊糊的，要不是有一点python的基础，很多东西真的是完全看不懂哎。最后才想起可以把ts编译成js文件

vue的compiler模块

直接找到compiler模块下的入口index.js文件，根据它的代码，我们能猜出几个有用的信息（猜的，一步步来，错了再回来改）

1
2
3
4
5
6
7
8
9
10
exports.createCompiler = create_compiler_1.createCompilerCreator(function baseCompile(template, options) {
    var ast = index_1.parse(template.trim(), options);
    optimizer_1.optimize(ast, options);
    var code = index_2.generate(ast, options);
    return {
        ast: ast,
        render: code.render,
        staticRenderFns: code.staticRenderFns
    };
});

  1. 通过parse方法，可以得到一颗AST树
  2. 猜测render方法，应该是个渲染函数，将我们得到的AST树渲染成html
  3. staticRenderFns好像是一个数据渲染函数集合(因为最后有个s)

前端传统的AST，即抽象语法树，是把我们的js代码进行编译给浏览器理解。现在比如babel的编译，jsx语法的编译其实模仿的都是这种思想。

vue的shared模块

这个模块没有什么内容，一个utils文件主要给其他模块提供各种各样的配置函数

vue的core模块

observer

数据监听模块，我们的双向绑定就是其中之一

###