Vue.js 的源碼都在 src 目錄下嫌蚤，其目錄結(jié)構(gòu)如下。
src
├── compiler # 編譯相關(guān)
├── core # 核心代碼
├── platforms # 不同平臺的支持
├── server # 服務(wù)端渲染
├── sfc # .vue 文件解析
├── shared # 共享代碼
compiler
compiler 目錄包含 Vue.js 所有編譯相關(guān)的代碼咆贬。它包括把模板解析成 ast 語法樹，ast 語法樹優(yōu)化帚呼，代碼生成等功能掏缎。
編譯的工作可以在構(gòu)建時做（借助 webpack、vue-loader 等輔助插件）煤杀；也可以在運行時做眷蜈，使用包含構(gòu)建功能的 Vue.js。顯然沈自，編譯是一項耗性能的工作酌儒，所以更推薦前者——離線編譯。
core
core 目錄包含了 Vue.js 的核心代碼枯途，包括內(nèi)置組件忌怎、全局 API 封裝籍滴，Vue 實例化、觀察者榴啸、虛擬 DOM孽惰、工具函數(shù)等等。
這里的代碼可謂是 Vue.js 的靈魂鸥印，也是我們之后需要重點分析的地方灰瞻。
platform
Vue.js 是一個跨平臺的 MVVM 框架，它可以跑在 web 上辅甥，也可以配合 weex 跑在 natvie 客戶端上。platform 是 Vue.js 的入口燎竖，2 個目錄代表 2 個主要入口璃弄，分別打包成運行在 web 上和 weex 上的 Vue.js。
我們會重點分析 web 入口打包后的 Vue.js构回，對于 weex 入口打包的 Vue.js夏块，感興趣的同學(xué)可以自行研究。
server
Vue.js 2.0 支持了服務(wù)端渲染纤掸，所有服務(wù)端渲染相關(guān)的邏輯都在這個目錄下脐供。注意：這部分代碼是跑在服務(wù)端的 Node.js，不要和跑在瀏覽器端的 Vue.js 混為一談借跪。
服務(wù)端渲染主要的工作是把組件渲染為服務(wù)器端的 HTML 字符串政己，將它們直接發(fā)送到瀏覽器，最后將靜態(tài)標(biāo)記"混合"為客戶端上完全交互的應(yīng)用程序掏愁。
sfc
通常我們開發(fā) Vue.js 都會借助 webpack 構(gòu)建歇由， 然后通過 .vue 單文件的編寫組件。
這個目錄下的代碼邏輯會把 .vue 文件內(nèi)容解析成一個 JavaScript 的對象果港。
shared
Vue.js 會定義一些工具方法沦泌，這里定義的工具方法都是會被瀏覽器端的 Vue.js 和服務(wù)端的 Vue.js 所共享的。
總結(jié)
從 Vue.js 的目錄設(shè)計可以看到辛掠，作者把功能模塊拆分的非常清楚谢谦，相關(guān)的邏輯放在一個獨立的目錄下維護，并且把復(fù)用的代碼也抽成一個獨立目錄萝衩。
這樣的目錄設(shè)計讓代碼的閱讀性和可維護性都變強回挽，是非常值得學(xué)習(xí)和推敲的。
Vue.js 源碼目錄設(shè)計
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
- 文/潘曉璐 我一進店門，熙熙樓的掌柜王于貴愁眉苦臉地迎上來鸿市，“玉大人锯梁，你說我怎么就攤上這事⊙媲椋” “怎么了陌凳？”我有些...
- 文/不壞的土叔 我叫張陵，是天一觀的道長内舟。 經(jīng)常有香客問我合敦，道長，這世上最難降的妖魔是什么验游？ 我笑而不...
- 正文 為了忘掉前任充岛，我火速辦了婚禮，結(jié)果婚禮上耕蝉，老公的妹妹穿的比我還像新娘崔梗。我一直安慰自己，他們只是感情好垒在，可當(dāng)我...
- 文/花漫 我一把揭開白布蒜魄。 她就那樣靜靜地躺著，像睡著了一般场躯。 火紅的嫁衣襯著肌膚如雪权悟。 梳的紋絲不亂的頭發(fā)上，一...
- 文/蒼蘭香墨 我猛地睜開眼撒会，長吁一口氣：“原來是場噩夢啊……” “哼！你這毒婦竟也來了师妙？” 一聲冷哼從身側(cè)響起诵肛，我...
- 正文 年R本政府宣布，位于F島的核電站遇伞，受9級特大地震影響辙喂，放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜赃额，卻給世界環(huán)境...
- 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望叫确。 院中可真熱鬧跳芳，春花似錦、人聲如沸竹勉。這莊子的主人今日做“春日...
- 文/蒼蘭香墨 我抬頭看了看天上的太陽次乓。三九已至吓歇，卻和暖如春，著一層夾襖步出監(jiān)牢的瞬間票腰，已是汗流浹背城看。 一陣腳步聲響...
推薦閱讀更多精彩內(nèi)容
- 可以在github找到vue源碼目錄克隆下載到本地即可 編譯相關(guān)代碼:compiler目錄圖片.png相關(guān)組件,生...
- vue.js 的源碼都在 src 目錄下朝扼，其目錄結(jié)構(gòu)如下赃阀。 compiler compiler 目錄包含了 Vue...
- compiler 包含vue.js所有編譯相關(guān)代碼。包括把模版解析成ast樹擎颖，ast語法樹優(yōu)化榛斯，代碼生成等工具观游。 ...
- 1.什么是flow Flow[https://flow.org/en/docs/getting-started/]...
- 前言 本篇為學(xué)習(xí)筆記备典，記錄在慕課vue.js源碼解析教學(xué)視頻中學(xué)習(xí)到的知識。 一意述、準(zhǔn)備工作 ? 在本章節(jié),將會介...
