Google浏览器中开发调试的时候,右上角出现vue的图标,但是在开发者工具中没有出现vue调试(已在扩展程序中安装 Vue Devtools)

控制台却没有。

错误原因:

没显示调试工具的原因是用了生产环境的版本或是压缩的vue版本,或是没有勾选

https://github.com/vuejs/vue-devtools

1. If the page uses a production/minified build of Vue.js, devtools inspection is disabled by default so the Vue pane won't show up.
2. To make it work for pages opened via file:// protocol, you need to check "Allow access to file URLs" for this extension in Chrome's extension management panel.

解决方法:

官方建议在项目入口文件(main.js)引入:

Vue.config.devtools = true;

  

关于安装了Vue-devtools插件但在浏览器控制台不显示的解决方案的更多相关文章

  1. Chrome Vue Devtools插件安装和使用

    安装:fq后在chrome应用商店搜索 Vue Devtools并安装,安装成功后浏览器右上角有vue的图标 安装完毕后,打开含有vue框架的网站,这是vue图标会变亮,进入开发者工具,再右侧vue选 ...

  2. vue中使用baidushare分享到微信无法显示bug解决方案

    最近vue单页面项目中有个页面分享的功能需求,按以往经验,选择了百度开源的baidushare.js 经过一天的挣扎,终于弄清楚了分享到微信后无法显示的原因. 对比分析: 以往成功使用:另写了一个专门 ...

  3. Firefox浏览器怎么安装adobe flash player插件

    https://jingyan.baidu.com/article/0a52e3f435d171bf62ed7237.html 有些朋友在使用Firefox火狐浏览器,但是火狐浏览器安装以后是没有fl ...

  4. Vue安装及插件Vue Devtools

    vue安装: # 最新稳定版 $ npm install vue # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新 ...

  5. 解决游览器安装Vue.js devtools插件无效的问题

    一: 打开自己写的一个vue.js网页,发现这个图标并没有亮起来,还是灰色 解决方案:  1.我们先看看Vue.js devtools是否生效,打开Bilibili(https://www.bilib ...

  6. 在浏览器上安装 Vue Devtools工具

    Vue.js devtools是基于google chrome浏览器的一款调试vue.js应用的开发者浏览器扩展,可以在浏览器开发者工具下调试代码. 1)首先在github下载devtools源码,地 ...

  7. chrome浏览器的VUE调试插件Vue.js devtools

      chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装 ...

  8. 在google chrome浏览器上安装 Vue Devtools工具

    [转]https://www.cnblogs.com/tanyongli/p/7554045.html Vue.js devtools是基于google chrome浏览器的一款调试vue.js应用的 ...

  9. Vue安装Vue Devtools调试工具提示 Error: Cannot find module '@vue-devtools/build-tools' 解决办法

    我看网络上面安装Vue Devtools 调试工具的步骤几乎都是按照文章链接里的步骤进行安装, 但是在最终执行编译命令的时候 :npm run build ,提示如下错误: 尝试了很多方法,都不能解决 ...

随机推荐

  1. 吴裕雄--天生自然 PHP开发学习:表单 - 必需字段

    <?php // 定义变量并默认设为空值 $nameErr = $emailErr = $genderErr = $websiteErr = ""; $name = $ema ...

  2. 吴裕雄--天生自然 JAVA开发学习:String 类

    public class StringDemo{ public static void main(String args[]){ char[] helloArray = { 'r', 'u', 'n' ...

  3. PAT Basic 1132 数列的⽚段和(20) [数学问题-简单数学]

    题目 给定⼀个正数数列,我们可以从中截取任意的连续的⼏个数,称为⽚段.例如,给定数列{0.1, 0.2, 0.3,0.4},我们有(0.1) (0.1, 0.2) (0.1, 0.2, 0.3) (0 ...

  4. Python中的encode和decode

    原文地址:http://www.cnblogs.com/tingyugetc/p/5727383.html 1.Python3中对文本和二进制数据进行了比较清晰的区分,文本总是 unicode ,由  ...

  5. 2019年java后端年终总结(六年开发经验),送给正在努力的你

    长大之后,时间总是过得飞快,转眼之间,今年已经只剩下1天了.小时候总感觉遥不可及.只在科幻小说里面出现的2020年,已经开始进入蓄力期了. 这篇文章主要和大家聊一聊分析2019年java技术的更新给大 ...

  6. 循环队列--忘记分配空间和如何用tag判断队空队满

    #include<iostream> #define maxsize 100 using namespace std; struct CLqueue { int *Q; int front ...

  7. StartDT AI Lab | 需求预测引擎如何助力线下零售业降本增效?

    在当下经济明显进入存量博弈的阶段,大到各经济体,小到企业,粗放的增长模式已不适宜持续,以往高增长的时代已经成为过去,亟需通过变革发掘新的增长点.对于竞争激烈的线下零售行业而言,则更需如此. 零售行业一 ...

  8. 吴裕雄--天生自然 pythonTensorFlow图形数据处理:多线程队列操作

    import tensorflow as tf #1. 定义队列及其操作. queue = tf.FIFOQueue(100,"float") enqueue_op = queue ...

  9. Spring boot 基于注解方式配置datasource

    Spring boot 基于注解方式配置datasource 编辑 ​ Xml配置 我们先来回顾下,使用xml配置数据源. 步骤: 先加载数据库相关配置文件; 配置数据源; 配置sqlSessionF ...

  10. 在Orcl中通过SQL语句修改创建表

    1.创建表时定义唯一性约束 CREATE TABLE table_name ( column1 datatype null/not null, column2 datatype null/not nu ...