vue调试神器vue-devtools安装
vue-devtools安装
vue-devtools是一款用来调试Vue应用的Chrome插件,可极大提高开发者调试项目效率,接着我们说一下如何下载安装这个插件;
一、 从chrome商店直接下载安装
- 国内无法访问,你懂得,有条件的可以自己处理 : https://chrome.google.com/webstore/category/extensions
- 国内的也可以在此处下载 : http://www.cnplugins.com/
二、自己编译安装
第一步 : 克隆项目到本地
① 找到github上vue-devtools项目

② 使用git讲代码克隆到本地 :
git clone https://github.com/vuejs/vue-devtools.git
第二步 :
下载相关依赖 :
yarn 或 npm install
第三步 :
项目打包 :
yarn build 或 npm run build
第四步:
① 打开chrome 更多工具 -> 扩展程序 -> 加载已解压的扩展程序

② 选择打包好的文件

③ 添加完成

第五步:
F12打开控制台点击最右侧vue选项卡

vue调试神器vue-devtools安装的更多相关文章
- chrome浏览器的VUE调试插件Vue.js devtools
chrome浏览器的VUE调试插件Vue.js devtools 应用商店直接安装 安装成功后在VUE文件打开可以直接调试: 提示效果如下: F12进入调试状态即可: 安装中出现的问题: 插件安装 ...
- 【vue】Vue调试神器vue-devtools安装
转载:https://segmentfault.com/a/1190000009682735 前言 vue-devtools是一款基于chrome游览器的插件,用于调试vue应用,这可以极大地提高我们 ...
- Vue调试神器之Vue.js devTools
Vue项目中使用Vue.js devTools这款调试神器,可以极大程度的提高我们的开发效率. 安装 1.打开Chrome网上应用商店安装插件(自墙),直接搜索devTools安装即可.贵宾传送阵,请 ...
- Vue中devtools安装使用
vue.js的devtools安装 安装 1.github下载地址:https://github.com/vuejs/vue-devtools 2.下载好后进入vue-devtools-master工 ...
- Vue开发调试神器 vue-devtools
Vue开发调试神器: vue-devtools 1. 下载Chrome扩展插件GitHub下载地址: https://github.com/vuejs/vue-devtools 建议使用npm淘宝镜像 ...
- vue 代码调试神器
一.序 工欲善其事,必先利其器.作为一名资深程序员,相信必有一款调试神器相伴左右,帮助你快速发现问题,解决问题.作为前端开发,我还很年轻,也喜欢去捣鼓一些东西,借着文章的标题,先提一个问题:大家目前是 ...
- Vue安装以及Vue项目创建以及Vue Devtools安装
这几天一直在学习Vue.js框架. 因为以前没有前端项目的经验,也没学过什么前端框架,所以,对于vue.js的学习有些不知所措. 在vue.js官网看教程,按照教程指点,可以不用脚手架开发,也可以搭建 ...
- chrome浏览器安装vue调试器vue-devtools
chrome浏览器安装vue调试器vue-devtools https://blog.csdn.net/zhangjnwei/article/details/76693053
- 简简单单的Vue4(vue-cie@3.x,vue’Debug[调试],vue‘sHttp)
既然选择了远方,便只顾风雨兼程! __HANS许 系列:零基础搭建前后端分离项目 系列:零基础搭建前后端分离项目 vue-cli@3.x 创建项目 Vue的Debug(调试) Vue的Http请求 提 ...
随机推荐
- python * 的区别
>>> ['Spam']*5 ['Spam', 'Spam', 'Spam', 'Spam', 'Spam'] >>> ['Spam'*5] ['SpamSpamS ...
- 视觉slam十四讲习题ch3-6
题目回顾: 一般解线性方程Ax=b有哪几种做法?你能在Eigen中实现吗? 解: 线性方程组Ax = b的解法 : 1.直接法:(1,2,3,4,5) 2.迭代法:如Jacobi迭代法(6) 其中只有 ...
- Open Judge 2750 鸡兔同笼
2750:鸡兔同笼 ...
- in运算符(javascript)
in的用法,如x in y: 1.如果第二个运算数为对象,则in运算符用来检测第一个运算数是否是第二个运算数的属性名.是,返回true,否则返回false. 例: var obj = {x:1,y:2 ...
- 基于 fireasy 构建的 asp.net core 示例
最近花时间弄了一个关于fireasy使用的demo,已放到 github 上供大家研究,https://github.com/faib920/zero 该 demo 演示了如何使用 fireasy 创 ...
- 为了解决linux配置Nginx 只能关闭防火墙才能访问的问题
使用Nginx和iptables做访问权限控制(IP和MAC) 之前配置的服务器,相当于对整个内网都是公开的,而且,除了可以通过80端口的nginx来间接访问各项服务,也可以绕过nginx,直 ...
- SQL语句order by两个字段同时排序。
ORDER BY 后可加2个字段,用英文逗号隔开.理解:对两个字段都排序,并不是之排序其中的一个字段: f1用升序, f2降序,sql该这样写 ORDERBY f1, f2 DESC 也可以这样 ...
- 小白的Python之路 day5 hashlib模块
hashlib模块 一.概述 用于加密相关的操作,3.x里代替了md5模块和sha模块,主要提供 SHA1, SHA224, SHA256, SHA384, SHA512 ,MD5 算法 二.算法的演 ...
- 见微知著——从自定义类型的operator==说起
今天打算用C++模拟一下Java的Object对象.需求很简单,通过一个自定义用户类型包装一个内建类型,并提供equals.hashCode.=和== 4种函数. 源码如下: #pragma once ...
- Binlog的三个业务应用场景
1.什么是binlog binlog是mysql的一种二进制日志文件,用来记录数据的变化.mysql使用binlog进行主从复制,如图: 客户端向master的mysql sever写入数据 当数据发 ...