Vue高階 原始碼解讀(前言)

2021-10-04 01:29:42 字數 1223 閱讀 2828

原始碼結構

├─dist                   # 專案構建後的檔案

├─scripts # 與專案構建相關的指令碼和配置檔案

├─flow # flow的型別宣告檔案

├─src # 專案源**

│ ├─complier # 與模板編譯相關的**

│ ├─core # 通用的、與執行平台無關的執行時**

│ │ ├─observe # 實現變化偵測的**

│ │ ├─vdom # 實現virtual dom的**

│ │ ├─instance # vue.js例項的建構函式和原型方法

│ │ ├─global-api # 全域性api的**

│ │ └─components # 內建元件的**

│ ├─server # 與服務端渲染相關的**

│ ├─platforms # 特定執行平台的**,如weex

│ ├─sfc # 單檔案元件的解析**

│ └─shared # 專案公用的工具**

└─test # 專案測試**

總體關心src/core和src/complier這兩個目錄下的**

帶著問題學習原始碼:

變化偵測篇

學習vue中如何實現資料的響應式系統,從而達到資料驅動檢視。

虛擬 dom 篇

學習什麼是虛擬 dom,以及vue中的dom-diff原理

模板編譯篇

學習vue內部是怎麼把template模板編譯成虛擬dom,從而渲染出真實dom

例項方法篇

學習vue中所有例項方法(即所有以$開頭的方法)的實現原理

全域性 api 篇

學習vue中所有全域性api的實現原理

生命週期篇

學習vue中元件的生命週期實現原理

指令篇

學習vue中所有指令的實現原理

過濾器篇

學習vue中所有過濾器的實現原理

內建元件篇

學習vue中內建元件的實現原理

osworkflow原始碼解讀 前言

很久以來,一直想做點事情。剛到新公司,工作任務遲遲沒有下來,總不能閒著,讀些原始碼積累下別人的智慧型。工作流是在做業務系統中最常用到的,現在這塊已非常成熟。以前自已仿 osworkflow 寫過乙個簡單的工作流引擎,與業務結合的太緊。隨著業務的修改 跟進其可維護性 可擴充套件性變得一塌糊塗。希望通過...

Vue原始碼解讀

1 例項的屬性和方法 下圖 2 原型上的屬性和方法 下圖 3 原型鏈 下圖 上圖有誤,後續修正 const vm new vue 之後有 vm.proto vue.prototype vm.proto proto object.prototype vm.proto proto proto null ...

Vue原始碼解讀(二) Vue原始碼構建

vue.js 原始碼是基於 rollup 構建的,它的構建相關配置都在 scripts 錄下。通常 個基於 npm 託管的項 都會有 個 package.json 件,它是對項 的描述 件,它的內容實際上是 個標準的 json 物件。我們通常會配置 script 字段作為 npm 的執 指令碼,vu...