课程来源: 开课吧
图片.png
迁代码出来先开始
- git clone https://github.com/vuejs/vue.git
- 第一步 安装依赖 npm i
- 安装 rollup npm i rollup -g 打包工具适合纯js
- 修改dev脚本
图片.png
可以尝试更改源码 or not 打包
npm run dev 查看走的目录是什么 以及替换的是什么
关注目录dist
- common 为 老版本打包器而准备的webpack 1.多 导出require
- esm 可能就是为 webpack 2.多 现代打包器导出而准备
- vue.js 和 vue.min.js 没有common 和 esm 输出格式说明 cjs
- esm.browser.js 浏览器专用版本,浏览器也支持es6的模块话的导入导出方式
输出格式说明:
cjs: webpack 1.xxx 或者 browserfiy
esm: webpack 2.xxx
umd: 兼容cjs和amd浏览器异步加载方式 node端
runtime: 仅包含运行时,没有编译器,( 已经提前打包了,不需要浏览器写一个字符串模板实时编译 )
flow: 类型申明,用flow语法检查用的
packages: 独立于vue核心代码外的模块( 像服务端渲染 weex..)
scripts: 全部的打包脚本
src: 重要源码目录
- 有编译器compiler
- core核心代码
- 平台: 浏览器 和 移动端weex
- server: 服务端渲染
- sfc: 单文件解析器
shared: 共用代码
test: 测试代码
types: 源码用flow写,所以用typescript专门写了一套
图片.png
入口点:
packages.json里
目标:
- vue源码学习整体流程
- 调试环境
- 数据响应式
