vue源碼debug環境搭建

概述

爲了探究vue的本質,所以想debug一下源碼,但是怎麼開始是個問題,於是有了這樣一篇記錄。
目標是爲了可以調試es6版本的,也就是src下的源碼,所以主要是sourceMap的開啓。
原文來自:https://blog.csdn.net/ReusLi/...。因爲不喜歡其排版,所以簡單整理一下。

流程

1.clone vue項目本身
這裏是vue項目的克隆地址https://github.com/vuejs/vue.git,執行常規的git clone命令就好。

git clone https://github.com/vuejs/vue.git

2.npm install
3.npm setup
4.npm install rollup-plugin-alias@^1.4.0 -D (非win10用戶可跳過該步)
5.修改克隆下來的項目中的\build\config.js文件中的function genConfig (name) {}內部的配置對象const config = {xxx},在其中加入sourceMap: true字段。
6.npm run dev啓動調試環境
7.打開/exapmle/commits/index.html(在瀏覽器中直接打開即可),直接F12調試即可。

備註

第6步起來後,會在/dist目錄下生成一個vue.js的文件,只要引入該文件即可調試。第7步中的examples文件夾中的文件作爲示例使用。

結語

至此就可以開心的研究vue源碼啦。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章