vue2.6.13
第一节
为了在浏览器调试源码中，查看当前代码在源码中的位置，需要在packages.json中加上
json
{
"scripts": {
"dev": "rollup -w -c scripts/config.js --sourcemap --environment TARGET:web-full-dev"
}
}之后再启动npm run dev
注意点：
- 当调试 vue 的源码就会发现，函数的解释其实在源码中就有了，只不过是英文， 比如
initInternalComponent函数 - 变量名及函数名都是有意义的，要注意
怎样写会进入什么函数
为什么 js 文件中可以出现类型判断：使用了 flow
调试麻烦
第三节
Vue 2.6.13 源码 examples 目录分析
注意：2.6 2.5 源码其实相差不大，对比着看就行
这个 examples/ 目录包含了 Vue.js 的官方示例，展示了 Vue 的各种核心功能和最佳实践。每个示例都有特定的用途： 📁 主要示例分类
- 基础功能示例 commits/ - GitHub API 数据获取 演示：v-for、v-model、watch、filters、异步数据加载 用途：学习数据绑定、条件渲染、过滤器使用 todomvc/ - 经典 TodoMVC 实现 演示：完整的 SPA 应用、路由、本地存储、组件通信 用途：学习 Vue 应用架构、状态管理、生命周期
- 组件化示例 tree/ - 递归树形组件 演示：递归组件、Vue.set、动态数据操作 用途：学习复杂组件设计、递归渲染 modal/ - 模态框组件 演示：插槽（slots）、过渡动画、组件通信 用途：学习可复用组件设计 grid/ - 数据表格组件 演示：组件 props、计算属性、排序过滤 用途：学习数据展示组件
- 特殊功能示例 svg/ - SVG 图形操作 演示：Vue 与 SVG 结合、动态图形生成 用途：学习数据可视化 markdown/ - Markdown 编辑器 演示：v-html、第三方库集成、防抖处理 用途：学习富文本处理 firebase/ - Firebase 集成 演示：实时数据库、表单验证、插件使用 用途：学习后端集成
- 动画和交互示例 elastic-header/ - 弹性头部动画 move-animations/ - 移动动画 select2/ - 下拉选择组件 🚀 如何使用这些示例
- 直接运行
- 学习路径建议 入门：commits/ → markdown/ → modal/ 进阶：todomvc/ → tree/ → grid/ 高级：firebase/ → svg/ → 动画示例
- 源码学习重点 组件注册：看 Vue.component() 的使用 生命周期：观察 created、mounted 等钩子 响应式数据：理解 data、computed、watch 模板语法：学习 v-for、v-if、v-model 等指令
- 调试技巧 使用 debugger 语句在关键位置打断点 在浏览器开发者工具中观察 Vue 实例 修改示例代码来理解不同功能 �� 学习建议 从简单开始：先看 commits 和 markdown 示例 动手实践：修改示例代码，观察变化 对比学习：比较不同示例的实现方式 深入源码：结合 Vue 源码理解示例中的 API 这些示例是学习 Vue.js 的绝佳资源，每个都展示了特定的 Vue 特性和最佳实践。
关于源码的学习，边学习边调试肯定是不错的方法，但是自己写实例对于新人来说一个是不知道如何下手，一个是写的不完美，索性直接从官网 example 入手 可以更改相关文件
服务端、wxxee 端
js
<script src="../../dist/vue.min.js"></script>源码阅读建议：源码一般都得看好几遍，即使再有人带的情况下，我的建议是最起码看三遍
- 第一遍先快速的浏览下，知道那个文件是干嘛的，哪个函数大概的作用
- 第二遍跟着教程调试，遇见不懂的地方记下来
- 第三遍写自己测试用例，并写下自己的理解
- 理解每个函数的参数都是什么，自己写一个小型的 vue
可以根据报错信息从源码解读，看看错误出现在哪
画流程图，与函数栈对应起来
抓大放小，源码不用一行一行深究，只需要知道大概的逻辑就可以，这个深度具体的自己把握，深了太浪费时间，浅了又不深刻 我的参考建议是流程类必须深究，工具类函数可以只是了解下， 接下来在我一些具体文章中可以体会到
演示一个完整的流程
我的一个兴趣爱好是-如何触发代码里的各种 warn
为什么非生产环境要判断，生产环境不需要判断吗？
源码与现象：重大的问题相结合
树结构举例
为什么注释会分行
结构、行 => 块 => 功能