獲取VUE
項(xiàng)目地址：https://github.com/vuejs/vue
遷出項(xiàng)目： git clone https://github.com/vuejs/vue.git
當(dāng)前版本號：2.6.10
文件結(jié)構(gòu)
├─ .circleci // 包含CircleCI持續(xù)集成/持續(xù)部署工具的配置文件
├─ .github // 項(xiàng)目相關(guān)的說明文檔
├─ benchmarks // 基準(zhǔn),性能測試文件炫刷，Vue的跑分demo面褐，比如大數(shù)據(jù)量的table或者渲染大量SVG
├─ dist // 構(gòu)建后輸出的不同版本Vue文件(UMD拼缝、CommonJS、ES 生產(chǎn)和開發(fā)包)
├─ examples // 部分示例修赞，用Vue寫的一些小demo
├─ flow // flow 因?yàn)閂ue使用了 [Flow](https://flow.org/) 來進(jìn)行靜態(tài)類型檢查询件，靜態(tài)類型檢查類型聲明文件
├─ packages // 包含服務(wù)端渲染和模板編譯器兩種不同的NPM包杆融，是提供給不同使用場景使用的
├─ scripts // 存放npm腳本配置文件楞卡，結(jié)合webpack、rollup進(jìn)行編譯、測試蒋腮、構(gòu)建等操作（使用者不需要關(guān)心）
│ ├─ alias.js // 模塊導(dǎo)入所有源代碼和測試中使用的別名
│ ├─ config.js // 包含在'dist/`中找到的所有文件的生成配置
│ ├─ build.js // 對 config.js 中所有的rollup配置進(jìn)行構(gòu)建
├─ src // 主要源碼所在位置淘捡，核心內(nèi)容
│ ├─ compiler // 解析模版相關(guān)
│ ├─ codegen // 把AST轉(zhuǎn)換為Render函數(shù)
│ ├─ directives // 通用生成Render函數(shù)之前需要處理的指令
│ ├─ parser // 解析模版成AST
│ ├─ core // Vue核心代碼，包括內(nèi)置組件池摧，全局API封裝焦除，Vue 實(shí)例化，觀察者作彤，虛擬DOM, 工具函數(shù)等等膘魄。
│ ├─ components // 組件相關(guān)屬性，主要是Keep-Alive
│ ├─ global-api // Vue全局API竭讳，如Vue.use,Vue.extend,Vue.mixin等
│ ├─ instance // 實(shí)例化相關(guān)內(nèi)容创葡，生命周期、事件等
│ ├─ observer // 響應(yīng)式核心目錄绢慢，雙向數(shù)據(jù)綁定相關(guān)文件
│ ├─ util // 工具方法
│ └─ vdom // 包含虛擬DOM 創(chuàng)建（creation）和打補(bǔ)丁(patching) 的代碼
│ ├─ platforms // 和平臺相關(guān)的內(nèi)容灿渴，Vue.js 是一個跨平臺的MVVM 框架(web、native呐芥、weex)
│ ├─ web // web端
│ ├─ compiler // web端編譯相關(guān)代碼，用來編譯模版成render函數(shù)basic.js
│ ├─ runtime // web端運(yùn)行時相關(guān)代碼奋岁，用于創(chuàng)建Vue實(shí)例等
│ ├─ server // 服務(wù)端渲染
│ └─ util // 相關(guān)工具類
│ └─ weex // 基于通用跨平臺的 Web 開發(fā)語言和開發(fā)經(jīng)驗(yàn)思瘟，來構(gòu)建 Android、iOS 和 Web 應(yīng)用
│ ├─ server // 服務(wù)端渲染（ssr）
│ ├─ sfc // 轉(zhuǎn)換單文件組件（*.vue）
│ └─ shared // 全局共享的方法和常量
├─ test // test 測試用例
├─ types // Vue新版本支持TypeScript闻伶，主要是TypeScript類型聲明文件
├─ node_modules // npm包存放目錄
|-- .babelrc.js // babel配置
|-- .editorconfig // 文本編碼樣式配置文件
|-- .eslintignore // eslint校驗(yàn)忽略文件
|-- .eslintrc.js // eslint配置文件
|-- .flowconfig // flow配置文件
|-- .gitignore // Git提交忽略文件配置
|-- BACKERS.md // 贊助者信息文件
|-- LICENSE // 項(xiàng)目開源協(xié)議
|-- package.json // 依賴
|-- README.md // 說明文件
|-- yarn.lock // yarn版本鎖定文件
調(diào)試環(huán)境搭建
安裝依賴
npm i
安裝rollup(rollup是打包工具滨攻，用于打包純代碼項(xiàng)目)
npm i -g rollup
修改dev腳本 打開packge.json 找到dev 添加sourcemap
"dev": "rollup -w -c scripts/config.js --sourcemap --environment TARGET:web-full-dev",
引入前面創(chuàng)建的vue.js,在example中創(chuàng)建html文件并引入
<script src="../../dist/vue.js"></script>
接下來我們就可以在瀏覽器中愉快的進(jìn)行調(diào)試代碼了
