vue源码阅读—07—编译原理之编译入口

本文主要是介绍vue源码阅读—07—编译原理之编译入口，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

src文件夹下的compile模块是公用的， 所以我们通过给createCompiler传递不同的base_options可以获取不同的compile函数； 这就是函数柯里化； 比如一个函数a本来需要接收5个参数，然后a函数先接收1个参数，然后返回一个子函数b，我们使用b函数的时候，再把剩下的4 个参数传递进去；     通过传递不同的baseOptions，生成了不同的compile函数； 而createCompileToFuntion函数也是需要compile函数作为参数的，所以又生成了不同的compileToFuntions函数；

 

 

 

 

https://ustbhuangyi.github.io/vue-analysis/v2/compile/entrance.html#%E6%80%BB%E7%BB%93

编译的入口：

在/entry-runtime-with-compiler.js，通过compileToFuntions方法，把template模板作为参数穿进去，然后通过解构赋值的方法取到render函数；

 

那么compileToFuntions这个函数是从哪里获取的？

执行createCompiler方法，createCompile就是src/compiler的公共编译模块，

createCompiler函数是通过执行createCompileCreator函数得到的； 

到这里我们就找到了createCompiler函数，执行这个函数就会返回一个对象，对象里有compile方法和compileToFunctions属性。

要注意的是，我们传递的baseOptions不同，compile函数由于会引用baseOptions，所以得到的compile函数也是不同的。

又因为createCompileToFuntions会把compile作为参数即回调函数，所以不同的baseOptions会有不同的createCompileToFunctionFn方法；

 

 

 

 

createCompileToFunctionFn函数内部会调用compile函数，compile函数内部会调用baseCompile函数，

baseCompile函数是真正的编译，主要有是三步，

1.将模板编译为ast树

2.optimize，将ast树优化

3.generate，将ast树转化为render函数；

 

 

 

 

 

 

这篇关于vue源码阅读—07—编译原理之编译入口的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！