分享vue.js devtools遇到一系列问题

使用vue.js devtools遇到的磕磕绊绊，具体如下

1.首先我们需要在谷歌浏览器扩展程序中点击获取更多

2.在搜索框输入vue.js devtools，点击安装此扩展

3.检查扩展是否开启

我们需要检测我的扩展是否开启，允许文件地址是否访问，如果没有勾选文件地址我们就必须在服务器上访问。

4.修改插件配置文件

代码如下:

C:\Users\zhanglei\AppData\Local\Google\Chrome\User Data\Default\Extensions\nhdogjmejiglipccpnnnanhbledajbpd\3.1.4_0\manifest.json文件

修改如下：

5.如果点击vue扩展图标还是提示：

代码如下:

Vue.js is detected on this page. Open DevTools and look for the Vue panel.

你可以检查下你是否使用的是压缩版本的vue.min.js，使用vue.min.js默认为生产环境的。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 详解vue.js的devtools安装

    详解vue.js的devtools安装

    安装 1.github下载地址:https://github.com/vuejs/vue-devtools 2.下载好后进入vue-devtools-master工程 执行npm install ----->npm run build. 3.修改manifest.json 中的persistent为true 4.打开谷歌浏览器设置--->扩展程序-->勾选开发者模式--->添加工程中的shells-->chrome的内容或者直接拖动shells-->chrome,至此恭

  • 分享vue.js devtools遇到一系列问题

    分享vue.js devtools遇到一系列问题

    使用vue.js devtools遇到的磕磕绊绊,具体如下 1.首先我们需要在谷歌浏览器扩展程序中点击获取更多 2.在搜索框输入vue.js devtools,点击安装此扩展 3.检查扩展是否开启 我们需要检测我的扩展是否开启,允许文件地址是否访问,如果没有勾选文件地址我们就必须在服务器上访问. 4.修改插件配置文件 复制代码 代码如下: C:\Users\zhanglei\AppData\Local\Google\Chrome\User Data\Default\Extensions\nhdo

  • Vue插件报错:Vue.js is detected on this page.问题解决

    Vue插件报错:Vue.js is detected on this page.问题解决

    Vue插件报错:Vue.js is detected on this pag 下载Vue插件 下载地址:https://chrome.pictureknow.com/ 将下载好的crx文件拖进拓展程序 首先去https://www.bilibili.com/  验证一下Vue.js.devtools是否安装好(看插件的颜色).因为B站是基于Vue开发的. 解决:Vue.js not detected 打开"允许访问文件网址","收集各项错误". 解决:Vue.js

  • vue.js出现Vue.js not detected错误的解决方案

    目录 vue.js出现Vue.js not detected Vue.js not detected?与众不同的解决方案 vue.js出现Vue.js not detected 第一:在拓展应用的文件夹中找到文件manifest.json,打开并将此处的false改成true. 第二:在vuejs devtool拓展程序的详情页中开启以下两个选项 如果你看到这,恭喜你,看到全网解决这个问题的方法!!!! 以上都是网上有的,但是会有一个小坑, 让很多人....痛....不....欲....生! 看

  • Vue.js学习示例分享

    Vue.js学习示例分享

    本篇和大家分享的是学习Vuejs的总结和调用webapi的一个小示例: » Vuejs - 学习大杂烩 » WebApi + Vue.js 示例 下面一步一个脚印的来分享: » Vuejs - 学习大杂烩 首先,咋们要学习一个js框架,那么肯定要引入该框架的基础库,这里我创建一个页面并且引用官网的库是: <script src="https://unpkg.com/vue/dist/vue.js"></script> 下面我们来看一段Vue的基础使用代码: va

  • vue.js 微信支付前端代码分享

    实例如下所示: onBridgeReady: function () { const openId = localStorage.getItem('openId') payService.payment(this.$route.params.orderId, 1, openId).then(rt => { //1:支付类型,可不填 this.message = rt.t WeixinJSBridge.invoke( 'getBrandWCPayRequest', { 'appId': this.

  • vue.js配合$.post从后台获取数据简单demo分享

    首先导入 <script type="text/javascript" src="/island/stage/js/vue.min.js"></script> html样式: <div id="main-content" class="wrap-container zerogrid"> <article id="news_content" v-for="i

  • Vue.js 递归组件实现树形菜单（实例分享）

    Vue.js 递归组件实现树形菜单（实例分享）

    最近看了 Vue.js 的递归组件,实现了一个最基本的树形菜单. 项目结构: main.js 作为入口,很简单: import Vue from 'vue' Vue.config.debug = true import main from './components/main.vue' new Vue({ el: '#app', render: h => h(main) }) 它引入了一个组件 main.vue: <template> <div class="tree-m

  • 分享一个精简的vue.js 图片lazyload插件实例

    这个插件未压缩版本只有7.62kb,很精简,支持img标签和background-img资源的lazyload.支持vue.js 1.0 和vue.js 2.0 安转 $ npm install vue-lazyload --save 使用方法 //main.js import Vue from 'vue' // import VueLazyload import VueLazyload from 'vue-lazyload' //use custom directive Vue.use(Vue

  • Vue.js 2.0学习教程之从基础到组件详解

    Vue.js 2.0学习教程之从基础到组件详解

    前言 最近这段时间里不停的做着Vue的技术分享,虽然不是什么深层次的代码底能架构,如果底层架构真说出来,我就不会做Vue.js 2.0从基础到组件了,就会分享Vue从底层到还是到底层.我相信能来看我这次分享的朋友都是在工作开发层面上面临着一些问题.此次分享我们先抛开Vue - router和Vuex,很多朋友都觉得Vuex和router比较难,大错特错! 对Vue 2.0的介绍 我对Vue 2.0认知,能it前端框架的认知,在我们不算底层原理的情况下,什么才是精髓,那就是基础的方法和一些api介

  • Vue.js系列之vue-router(上)(3)

    Vue.js系列之vue-router(上)(3)

    说明: 我们项目现在用的是:vue2.0 + vue-cli + webpack + vue-router2.0 + vue-resource1.0.3 如果大家在实践的过程中与本文所说的内容有较大区别的话看看是不是版本问题. 本文是一系列文章,在我对Vue有了更深刻的理解认识之后会对文章及时进行修改或更正.欢迎大家批评指出错误.以下是已完成的文章列表. 1.Vue.js系列之项目搭建(1) 2.Vue.js系列之项目结构说明(2) 概述 Vue非常适用于实践单页面应用程序也就是平时大家说的比较

随机推荐