VUE源碼--目錄結構（一）

源碼目錄結構

VUE 2.6.10
├── scripts             # 打包相關的配置文件，其中最重要的是config.js。主要是根據不一樣的入口，打    包爲不一樣的文件。
├── dist             # 打包以後文件所在位置
├── examples         # demo示例
├── flow             # Vue使用了Flow來進行靜態類型檢查，這裏定義了聲明瞭一些靜態類型
├── packages         # vue還能夠分別生成其它的npm包
├── src             # 主要源碼所在位置
    ├── compiler        # 編譯相關 
        ├── codegen         #根據ast生成render函數
        ├── directives         #通用生成render函數以前須要處理的指令
        ├── parser             #模板解析
    ├── core            # 核心代碼
        ├── components         #全局的組件，這裏只有keep-alive
        ├── global-api     #全局方法，也就是添加在Vue對象上的方法，好比Vue.use,Vue.extend,,Vue.mixin等
        ├── instance         #實例相關內容，包括實例方法，生命週期，事件等
        ├── observer         #雙向數據綁定相關文件
        ├── util             #工具方法
        ├── vdom             #虛擬dom相關 
    ├── platforms       # 不一樣平臺的支持
        ├── web             #web端獨有文件
            ├── compiler         #編譯階段須要處理的指令和模塊
            ├── runtime         #運行階段須要處理的組件、指令和模塊
            ├── server             #服務端渲染相關
            ├── util             #工具庫
        ├── weex             #weex端獨有文件
    ├── server          # 服務端渲染
    ├── sfc             # vue 文件解析
    ├── shared          # 共享工具代碼
├── test             # 測試用例

==主要源碼所在位置Src==

1. compiler

compiler 目錄包含 Vue.js 全部編譯相關的代碼。它包括把模板解析成 ast 語法樹，ast 語法樹優化，代碼生成等功能。

編譯的工做能夠在構建時作（藉助 webpack、vue-loader 等輔助插件）；也能夠在運行時作，使用包含構建功能的 Vue.js。顯然，編譯是一項耗性能的工做，因此更推薦前者——離線編譯。

1. core
   core 目錄包含了 Vue.js 的核心代碼，包括內置組件、全局 API 封裝，Vue 實例化、觀察者、虛擬 DOM、工具函數等等。

   這裏的代碼可謂是 Vue.js 的靈魂，也是咱們以後須要重點分析的地方。

2. platform
   Vue.js 是一個跨平臺的 MVVM 框架，它能夠跑在 web 上，也能夠配合 weex 跑在 native 客戶端上。platform 是 Vue.js 的入口，2 個目錄表明 2 個主要入口，分別打包成運行在 web 上和 weex 上的 Vue.js。

   咱們會重點分析 web 入口打包後的 Vue.js，對於 weex 入口打包的 Vue.js，感興趣的同窗能夠自行研究。

3. server

   Vue.js 2.0 支持了服務端渲染，全部服務端渲染相關的邏輯都在這個目錄下。注意：這部分代碼是跑在服務端的 Node.js，不要和跑在瀏覽器端的 Vue.js 混爲一談。

   服務端渲染主要的工做是把組件渲染爲服務器端的 HTML 字符串，將它們直接發送到瀏覽器，最後將靜態標記"混合"爲客戶端上徹底交互的應用程序。

4. sfc

   一般咱們開發 Vue.js 都會藉助 webpack 構建， 而後經過 .vue 單文件來編寫組件。

   這個目錄下的代碼邏輯會把 .vue 文件內容解析成一個 JavaScript 的對象。

5. shared
   Vue.js 會定義一些工具方法，這裏定義的工具方法都是會被瀏覽器端的 Vue.js 和服務端的 Vue.js 所共享的。

引用: Vue.js 技術揭祕.