边喝热水边学Vue源码之三-找到入口
## 从入口开始据说Runtime + Compiler 构建出来的 Vue.js，它的入口是 `src/platforms/web/entry-runtime-with-compiler.js`
Vue 的入口，由于`import Vue from './runtime/index'`，它定义在 `src/platforms/web/runtime/index.js`
说实话这章没怎么听懂，应该还是js的代码量积累不够，没有足够的项目支撑看起来比较困难，这里的内容以后再补充吧。
#### 原型上挂方法
说说自己学到的东西，见下面的代码片段
```js
initMixin(Vue)
stateMixin(Vue)
eventsMixin(Vue)
lifecycleMixin(Vue)
renderMixin(Vue)
```
下面是initMixin方法的片段
```js
export function initMixin (Vue: Class<Component>) {
Vue.prototype._init = function (options?: Object) {
const vm: Component = this
// a uid
vm._uid = uid++
```
这里给vue添加方法的方式时通过原型链挂载，这个在道总之前的将油猴脚本的时候花了很大时间强调过的，在这里遇到了，不懂得可以取看看他得帖子[油猴脚本开发指南\]原型与原型链-油猴中文网 (tampermonkey.net.cn)](https://bbs.tampermonkey.net.cn/thread-744-1-1.html)，（顺利碰瓷大佬）还说到了ES5的语法比ES6更容易实现原型上的方法挂载。
这里提到了什么原型方法和静态方法，还不是很清楚，后来弄懂了再来补充，算是给自己挖了一个坑。
## 数据驱动
听他讲了一堆，内容都没听懂，以后慢慢加深理解，先抄一下大纲：new Vue 发生了什么，Vue实例挂载的实现，render， Virtual DOM，createElement，update。
[数据驱动 | Vue.js 技术揭秘 (ustbhuangyi.github.io)](https://ustbhuangyi.github.io/vue-analysis/v2/data-driven/)
数据驱动的意思是在使用vue框架的页面上内容的修改是因数据发生了变化，而普通的
网页修改数据是通过Jquery直接修改dom，vue大大简化了代码量。
1. 每个vue文件都会算是一个vue对象，里面的数据推荐使用data函数而不是data对象；
2. dom操作很吃性能，所以推荐使用虚拟dom，而且虚拟dom没有那么多的属性，只保留了关键的属性；
3. 一些混淆的名词，node，element，dom元素，node节点；
4. 先把vue风格的标签转成node对象，然后加上一些属性和事件，再把这些node节点转为HTML中的标签就称为渲染；
5. dom由于数据驱动有生成和更新，后面会重新刷新标签内容，就需要一个观察者watcher来监控操作
6. 查看源码并不需要从GitHub上下载，找一个开发的vue项目里面就有vue的源码，路径如下`\node_modules\vue\src`
基础不牢，地动山摇。这三个小时花的不值呀，找哥哥吹牛逼都比这快乐。 vue2源码最复杂的地方就是mountPatch那部分了...
跟组件组合到一起贼几把复杂... 李恒道 发表于 2023-11-8 21:12
vue2源码最复杂的地方就是mountPatch那部分了...
跟组件组合到一起贼几把复杂... ...
现在我都看都没看明白，继续搞吧，后悔代码敲少了。 李恒道 发表于 2023-11-8 21:12
vue2源码最复杂的地方就是mountPatch那部分了...
跟组件组合到一起贼几把复杂... ...
说实话，要不我看过教程，mount和path这两个部分真把它们当成一个了，还寻思这是啥，哥哥我现在不知道是继续看下去还是写几个vue项目巩固一下，不过做难事必有所的。
页:
[1]