安装

1.github下载地址：https://github.com/vuejs/vue-devtools

2.下载好后进入vue-devtools-master工程  执行npm install ----->npm run build.

3.修改mainifest.json 中的persistant为true

4.打开谷歌浏览器设置--->扩展程序--》勾选开发者模式---》添加工程中的shells-->chrome的内容，至此恭喜已经安装成功！！！

5.打开自己的vue项目中，如果是有vue-cli构建的项目，执行npm run dev,打开http://localhost:8080/ 服务器调试地址；至此完成devtools的安装；

使用

打开vue项目,在控制台选择vue：
 
5. 可操作组件查看信息变化(例如分页组件)
 选择第一页：
 
 
 选择最后一页：
 

vue.js的devtools安装的更多相关文章

  1. vue.js中用npm安装vue-router时报错处理办法

    当在使用npm安装东西的时候,最怕遇到的就是,电脑并不想和你说话,只向你抛出一大堆错误...比如在vue.js中用npm安装vue-router的时候,我就遇到 一脸蒙逼的我默默的念了一句:卧..槽. ...

  2. vue.js下载及安装配置

    环境 Deepin15.4 下载及配置 node下载地址:http://nodejs.cn/download/ 解压到文件夹 /home/maskerk/vue/ 下 设置软连接: $ ln -s / ...

  3. Vue.js devtool插件安装后无法使用的解决办法

    初次使用Vue.js devtool插件的新人在安装了Vue.js devtool插件后,都会经常有一个疑问.我在chrome浏览器里面已经成功安装好Vue.js devtool插件,怎么点击后提示v ...

  4. 【转】vue.js三种安装方式

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

  5. vue.js三种安装方式

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

  6. vue.js 2.0 --- 安装node环境,webpack和脚手架(入门篇)

    1.环境搭建 1.1.安装node.js 1.2 安装过程很简单,一路“下一步”就可以了.安装完成之后,打开命令行工具(win+r,然后输入cmd),输入 node -v,如下图,如果出现相应的版本号 ...

  7. Vue.js devtool插件安装后无法使用的解决办法【最简单有效的解决方法】

    在开发vue相关的项目时,使用vue devtools工具是一件极其有趣的事,你所有的操作都马上给你实时反馈. 然而有时候安装好的工具,在chrome中不显示. 在网上找过多次,一直没有找到有效解决方 ...

  8. vue.js+web storm安装及第一个vue.js

    小白还是自己写一遍吧 1.下载node.js https://nodejs.org/en/download/ 2.安装淘宝镜像(类似于阿里云的maven中央仓库镜像) 安装时间有点长 安装命令:npm ...

  9. Vue中devtools安装使用

    vue.js的devtools安装 安装 1.github下载地址:https://github.com/vuejs/vue-devtools 2.下载好后进入vue-devtools-master工 ...

随机推荐

  1. SQLServer 循环1百万插入测试数据

    1,首先创建student表 create table student ( sno int primary key , sname VARCHAR(200) ) 2,--向数据库中插入100万条随机姓 ...

  2. 关于sem_unlink什么时候删除信号量

    sem_unlink在man手册里有这么一段话: sem_unlink() removes the named semaphore referred to by name. The semaphore ...

  3. linux指定动态运行库的位置

    动态运行库在windows.linux下均广泛使用.windows下通常为dll文件,linux下为so文件.不过,对于部署程序,这两个系统查找依赖的运行库文件时却不一样.对于windows而言,优先 ...

  4. Javascript常用正则表达式

    一.校验数字的表达式 数字:^[0-9]*$ n位的数字:^\d{n}$ 至少n位的数字:^\d{n,}$ m-n位的数字:^\d{m,n}$ 零和非零开头的数字:^(0|[1-9][0-9]*)$ ...

  5. eclipse里添加类似myeclipse打开当前操作目录

    1.开打eclipse ide,依次run->external tools->external tools configuration 2.在Program下,new一个自己定义的prog ...

  6. Linux 内核开发 - 进程空间

    1.1 虚拟内存 Linux 的系统.假设每一个任务都独立的占用内存,则实际的物理内存将非常快消耗殆尽.实际上对于前台正在执行的任务来说,所须要要的内存并不多,非常多任务基本不须要执行,也就没有必要一 ...

  7. 学习Swift中的CoreImage(图形核心编程)

    Core Image是一个可以让你轻松使用图形过虑器的强力框架.在这里你几乎可以获得所有不同种类的效果,比如修改图像饱和度,色彩范围,亮度等.它甚至也可以利用CPU或者GPU来处理图像数据并且它的速度 ...

  8. oracle数据库recover和restore的区别

    restore just copy the physical file, recover will consistent the database.restore 是还原,文件级的恢复.就是物理文件还 ...

  9. NFinal简介

    NFinalWeb框架是基于魔法糖语法思想创建的框架.本框架有两大特点.1.所有框架里最简单易学易配置的.2.所有框架里运行效率最快的. 相关介绍1.运行效率比任何php和java以及.net框架要快 ...

  10. .NET winform 的keypress事件中判断当用户按下的是哪个键

    keys是按键的枚举类型 private void txtPropertyValue_KeyPress(object sender, KeyPressEventArgs e) { if ((Keys) ...