zoukankan      html  css  js  c++  java
  • 菜鸟安装vue-devtool 工具

    vue-devtool工具是对运用了vue的页面在浏览器中进行调试的一个工具,进行安装如下几个步骤:

    1.在github官网中搜索 vue-devtool,然后进行下载压缩安装包,或者用git克隆。

    2.下载完之后进行解压,用命令提示行进入到解压的文件夹。

    3.执行命令  npm  install  ,或者用cnpm  install 都可以,后者安装会更快些,前提是也的安装了cnpm.

    4.安装完成之后执行npm run build

    5.执行完之后打开  shellschromemanifest.json文件,然后修改  persistent 为 true

    6.浏览器中   更多工具-扩展程序,然后直接把chrome文件拖入到页面中即可,到这里基本上就安装完了。

    更详细的安装教程可以参考这个:

     https://www.jianshu.com/p/5c2f5ab3f22f 
    主要想说的是遇到的一些问题,例如安装完之后,发现图标是灰色的,点击图标还出现 vue.js not detected  

    当时还不能理解,怎么我安装完不能用么?是我没开启还是什么,后面才知道只有当前页面引用了vue.js 这个图标才会亮起来。然后找了个含有vue的网页打开,果然图标是正常的,但是我f12还是没看到列表上有vue 调试的那个框。又是各种查,有的说浏览器上vue-devtool 上的允许访问文件网址要选上

    有的说重新打开浏览器,刷新然后f12才能看到,也有的说检查引用的是vue.js 还是引用的vue.min.js,通过筛选,觉得只有最后一个可以试试,但是因为第一次接触,还是菜鸟,还一直在想在哪检查是引用的vue.js还是vue.min.js,刚开始还以为是下载的包里是vue.min.js,但是翻了包也没见有这个文件,最后终于意识到你调试页面自然而然是看页面上使用的vue.min.js还是vue.js,然后自己简单写了一个例子,终于出现了调试面板。后面想想简直要被自己蠢哭了。。。。

    通过查阅总结一下几个需要注意的地方:

    1.重新打开浏览器

    2.允许访问文件地址

    3.修改persistent为true

    4.页面要引用 vue.js

  • 相关阅读:
    dedecms自定义表单提交获取时间跟ip地址
    JQuery购物车多物品数量的加减+总价计算
    jquery手机触屏滑动拼音字母城市选择器代码
    js实现图片上传实时显示
    js实现发送验证码倒计时效果
    JS 仿支付宝input文本输入框放大组件
    js实现倒计时效果
    jquery统计输入文字的个数并对其进行判断
    【Linux】Linux系统安全设置
    java泛型(generics)
  • 原文地址:https://www.cnblogs.com/97310ZT/p/10090439.html
Copyright © 2011-2022 走看看