咱们要对Vue源码进行分析,首先咱们须要可以对vue源码进行调式(这里的源码调式是ES6版本的,不是打包后的代码),所以首先咱们要去官方github上克隆一份vue项目下来,以下具体操做:html
1. clone vue项目vue
git clone https://github.com/vuejs/vue.git
2. 下载依赖包git
npm install
下载完后包,咱们把视线转移到package.json文件中的scripts来,以下打包命令:github
"scripts": { "dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev" },
这边咱们最关注的是 "dev" 这个打包命令,它是使用rollup进行打包的,咱们只须要在命令后面加入 --sourcemap 便可,好比以下web
"dev": "rollup -w -c scripts/config.js --environment TARGET:web-full-dev --sourcemap",
那么这样的话,当咱们执行命令 npm run dev 打包时,会在咱们的 dist 文件夹下 生成 vue.js.map 文件。npm
而后咱们把视线转移到项目中的 examples/commit/index.html 来,把页面引入的 <script src="../../dist/vue.min.js"></script> 改为 <script src="../../dist/vue.js"></script> 便可,这样当咱们继续 执行命令 npm run dev 后,而后咱们在本地打开该页面,咱们就会看到以下源码了,以下所示:json
这样咱们就能够对源码进行调试了。spa