Vue-DevTools的安装使用

Vue-DevTools的安装使用

方法一：
点击谷歌浏览器右上角 「三点 」图标

更多工具-----扩展程序-----谷歌商店-----找到Vue-DevTools安装即可
这种方法必须翻墙，如果可以翻墙很简单，要是不能，我们可以换第二种方法。

方法二
进入https://github.com/vuejs/vue-devtools/tree/master

1、可以直接download到本地
解压后，到vue-devtools-master文件夹中，执行 cnpm install 这个过程很慢很慢 慢慢等 不着急

2、然后 执行 npm run build ，这时候会发现vue-devtools-master文件夹中，多了一个shells文件夹，以后安装要选择它。

3、导入：

3.1 点击 … 然后点击 设置

设置 弹框 中点击 扩展程序

点击“加载已解压的扩展程序”按钮，选择vue-devtools>shells下的chrome文件夹。

安装成功：

vue-devtools如何使用
当我们添加完vue-devtools扩展程序之后，我们在调试vue应用的时候，chrome开发者工具中会看一个vue的一栏，点击之后就可以看见当前页面vue对象的一些信息。vue-devtools使用起来还是比较简单的，上手非常的容易，这里就细讲其使用说明了。