最近用vue开发,需要看一下vuex的数据结构,原本也没什么,就安装了一下vue-devtools,这边重温一下安装的过程。
首先去github上面下载一个压缩包。地址:https://github.com/vuejs/vue-devtools
这边是直接下载,另一个还没试过。
解压之后得到:
然后进入这个目录进行初始化npm install和编译npm run build,也可以用cnpm。这边顺便提一嘴,安装cnpm,直接在https://npm.taobao.org/管网里面找到这句命令执行就可以了:
npm install -g cnpm --registry=https://registry.npm.taobao.org。
然后打开谷歌浏览器,找到:
之后右上角开发者模式打开,点击这个:
选中目录下shells下chrome文件夹,这样就安装完成了,启动你的VUE项目,就能在开发者模式下看见:
这边说一下,我刚安装完,启动了项目没有出现VUE工具,重启了浏览器,然后VUE自动打开项目还是没有,我不知道是我电脑问题还是什么,必须关闭浏览器VUE项目然后重新打开,还要刷新一下才出现,本人觉得是电脑问题。
经过我的测试,安装完了之后删除这个vue-devtools-dev文件夹我们安装的VUE调试工具也会删除,意思就是说这个文件是不能删除的。
说真的,我很少用这个调试工具去操作什么,或许有很大的用途我还没遇见这样的场景而已,这边只是记录一下这个过程。
欢迎关注Coding个人笔记 公众号
网友评论