因为工作要求，目前主要在用Vue.js技术栈做开发，调试是必不可少的，这里会用的Vue DevTools的调试工具，问题就出在这里，当用Vue DevTools做调试时，很多时候都不能用，提示没有监测到Vue，这让工作效率瞬间拉低了。 [img]http://files.jb51.net/file_images/article/201712/201712050945228.png[/img] [b]安装: [/b] 1.到github下载： 2.在vue-devtools目录下安装依赖包 [b]修正Vue DevTools [/b] 好了，开始正题，下面来说一下修正的方法。 先从官网把Vue DevTools下载下来（[url=https://github.com/vuejs/vue-devtools]https: //github.com/vuejs/vue-devtools[/url]）。 [img]http://files.jb51.net/file_images/article/201712/201712050945239.png[/img] 关键步骤一.修改[code]persistent[/code] 找到文件[code]vue-devtools/shells/chrome/manifest.json[/code]，修改[code]persistent[/code]为[code]true[/code]。 [img]http://files.jb51.net/file_images/article/201712/2017120509452310.png[/img] 保存后，编译一下： [img]http://files.jb51.net/file_images/article/201712/2017120509452311.png[/img] 关键步骤二.勾选[code]允许访问文件网址[/code] 上一步已经把Vue DevTools写好了，接下来是安装这个扩展。 打开Chrome，在地址栏输入[code]chrome://extensions/[/code]，直接进入Chrome的扩展。 勾选最上方的[code]开发者模式[/code]，再点击“加载已解压的扩展程序…”，路径为：[code]vue-devtools-master/shells/chrome[/code] [img]http://files.jb51.net/file_images/article/201712/2017120509452312.png[/img] 勾选[code]允许访问文件网址[/code] [img]http://files.jb51.net/file_images/article/201712/2017120509452313.png[/img] 关键步骤三.加入Vue文件中加入[code]Vue.config.devtools[/code] 搞定！ 效果 [img]http://files.jb51.net/file_images/article/201712/2017120509452314.png[/img] 下载已修正版的Vue DevTools下载：[url=http://xiazai.jb51.net/201712/yuanma/vueDevTools_jb51.rar]vueDevTools(可监测修正版).zip[/url] 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持编程素材网。