vue源码debug环境搭建

60次阅读

共计 614 个字符,预计需要花费 2 分钟才能阅读完成。

概述
为了探究 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 install3.npm setup4.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 源码啦。

正文完
 0