1. 前言
vue版本：2.6.11
vue倉庫：https://github.com/vuejs/vue
vue文檔：https://cn.vuejs.org/
2. 開發模式
npm run dev，即運行package.json中的dev命令，其目的是把src/目錄下的相關文件打成為dist/vue.js文件。
2.1 解析dev命令
首先我們看看package.json中的dev命令：
"dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev"
rollup：為一個模塊打包器，類似於webpack、parcel。相關文檔：http://www.rollupjs.com/
-w：--watch 表示監聽源文件是否有改動，如果有改動，重新打包；
-c scripts/config.js：表示指定rollup的配置文件為scripts/config.js。
--environment TARGET:web-full-dev：表示在本次執行環境中 Node.js 內的 process.env.TARGET 的值。
2.2 scripts/config.js
scripts/config.js 為rollup的配置文件，通過process.env.TARGET('web-full-dev')，可在此文件內找到相關配置信息：
entry：rollup入口文件，實際為 src/platforms/web/entry-runtime-with-compiler.js 文件。
dest：打包后的輸出文件。
format：指定打包后的模塊類型；這里為 umd 模塊。
2.3 entry-runtime-with-compiler.js 與 Flow
說明：npm dev命令的最終入口文件地址為 src/platforms/web/entry-runtime-with-compiler.js。
打開文件后，發現里面有些不是常見的JS代碼：
這些內容都是與Flow相關的特性。
那么什么是Flow？Flow是JavaScript的靜態類型檢查工具，目的在於檢查JavaScript中的類型錯誤。類似於TypeScript中的指定類型。
src目錄的js都采用了這種寫法，可運行 npm run flow 檢查是否含有類型錯誤。查看Flow相關知識可閱讀：用Flow編寫更好的JavaScript代碼
3. src目錄結構
接下來我們看看src的目錄結構：
├── compiler 模板解析相關文件 │ ├── codegen 根據AST生成render函數 │ ├── directives render函數生成之前需要處理的指令 │ └── parser 模板解析 ├── core 核心代碼 │ ├── components 全局的組件；這里只有keep-alive(緩存不活動的組件實例) │ ├── global-api 全局方法；如Vue.use,Vue.extend,,Vue.mixin等 │ ├── instance 實例相關內容；包括實例方法，生命周期，事件等 │ ├── observer 雙向數據綁定相關文件 │ ├── util 工具方法 │ └── vdom 虛擬dom相關 ├── platforms 平台相關內容 │ ├── web web端 │ ├── compiler 編譯階段需要處理的指令和模塊 │ ├── runtime 運行階段需要處理的組件、指令和模塊 │ ├── server 服務端渲染相關 │ └── util 工具庫 │ └── weex weex端 ├── server 服務端渲染相關 ├── sfc 即Single File Components；對*.vue文件進行解析 └── shared 共享的工具和枚舉
可以看到vue分為了2個平台：web和weex，在這里我們主要以web為目標。
本篇文章不會講解Vue源代碼，后續會以雙向綁定、指令、組件等角度來閱讀源碼。