Vue系列---源碼調試(二)

咱們要對Vue源碼進行分析，首先咱們須要可以對vue源碼進行調式(這裏的源碼調式是ES6版本的，不是打包後的代碼)，所以首先咱們要去官方github上克隆一份vue項目下來，以下具體操做：

1. clone vue項目

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

2. 下載依賴包

npm install

下載完後包，咱們把視線轉移到package.json文件中的scripts來，以下打包命令：

"scripts": {
  "dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev"
},

這邊咱們最關注的是 "dev" 這個打包命令，它是使用rollup進行打包的，咱們只須要在命令後面加入 --sourcemap 便可，好比以下

"dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev --sourcemap",

那麼這樣的話，當咱們執行命令 npm run dev 打包時，會在咱們的 dist 文件夾下 生成 vue.js.map 文件。

而後咱們把視線轉移到項目中的 examples/commit/index.html 來，把頁面引入的 <script src="../../dist/vue.min.js"></script> 改爲 <script src="../../dist/vue.js"></script> 便可，這樣當咱們繼續 執行命令 npm run dev 後，而後咱們在本地打開該頁面，咱們就會看到以下源碼了，以下所示：

這樣咱們就能夠對源碼進行調試了。