从这里开始,记录VUE源码分析。
1. 将 vue 源码拉到本地,方便分析
vue 源码地址来自 全球最大同性交流网站-- gitHub:https://github.com/vuejs/vue
我们将 dev 分支代码克隆到本地
cd 到本地存放目录:
cd 你的本地存放目录
git clone 将代码clone下来
git clone https://github.com/vuejs/vue.git
⚠️ 如果想直接在github查看,可安装一个插件 Octotree ,可在github左侧生成一个 侧边导航,方便查看
2. clone源码之后,正式开始
首先,vue运行的时候,咱们通常是运行 npm run dev,到底vue是怎么运行起来的,咱们就从npm run dev入手。
打开 1.package.json,找到 scripts -> dev设置:
可以看到,这是rollup 启动了 "scripts/config.js" 中的 “web-full-dev”,咱们打开这个文件 2.vue/scripts/config.js,找到 web-full-dev
上边咱们可以看到,入口entry是 “web/entry-runtime-with-compiler.js”文件,咱们找到 3. src/platforms/web/entry-runtime-with-compiler.js
发现,Vue 是import进来的,再去找到 4. src/platforms/web//runtime/index
发现 vue 还是import出来的,再去找到 5. src/core/index
害,还是引入,再去找到 6. src/core/instance/index
哇哦,终于找到了 Vue出生的地方,它是一个函数。