vue调试工具vue-devtools的安装
一、可以在chrome商店中下载安装,当然需要FQ哈,你懂得~;
二、手动安装:
1.将github上项目文件克隆到本地,https://github.com/vuejs/vue-devtools;

bash上输入如上命令,回车确定,会将项目克隆到本地;
2.然后在
目录下打开bash,输入npm install命令,回车,
等待下载项目依赖包(这个时候你可以去泡杯咖啡),然后目录下就会多出一个node-modules文件夹,里面就是项目所依赖的包;
3.下载完毕,运行
命令,回车,来对项目文件进行编译;
4.打开chrome,可以输入 chrome://extensions/;
也可以在最右上角点击
按钮,更多工具--->扩展程序;来进入扩展程序页面;

点击 加载已解压的扩展程序(如果没有这个选项,请勾选开发者模式),然后选择 vue-devtools ---> shells --->chrome 文件夹即可;
5.添加完成~

6.打开F12开发者工具,会多出vue选项一栏,可以在里面看到组件、vue对象等的一些信息啥的~;

vue调试工具vue-devtools的安装的更多相关文章
- vue调试工具之 vue-devtools的安装
这里介绍一下vue-devtools的安装方法之一: chrome浏览器的应用商店不能直接访问(需要跨域),所以直接应用商店安装的方法就行不通了. 1.到github主页去下载安装: git clon ...
- vue调试工具vue-devtools安装及使用方法
vue调试工具vue-devtools安装及使用方法 https://www.jb51.net/article/150335.htm 本文主要介绍 vue的调试工具 vue-devtools 的安装和 ...
- vue.js的devtools安装
安装 1.github下载地址:https://github.com/vuejs/vue-devtools 2.下载好后进入vue-devtools-master工程 执行npm install - ...
- Chrome Vue Devtools插件安装和使用
安装:fq后在chrome应用商店搜索 Vue Devtools并安装,安装成功后浏览器右上角有vue的图标 安装完毕后,打开含有vue框架的网站,这是vue图标会变亮,进入开发者工具,再右侧vue选 ...
- Vue学习笔记-vue调试工具vue-devtools安装及使用
一 使用环境: windows 7 64位操作系统 二 vue调试工具vue-devtools安装及使用 1.下载: 百度中查找 "vue-devtools下载" 找到最新 ...
- VUE环境搭建、创建项目、vue调试工具
环境搭建 第一步 安装node.js 打开下载链接: https://nodejs.org/en/download/ 这里下载的是node-v6.9.2-x64.msi; 默认式的安装,默认 ...
- cnpm 安装vue与vue/cli
cnpm 安装 npm install -g cnpm --registry=https://registry.npm.taobao.org 安装 vue npm install -g npm 安装 ...
- vue.js 三种方式安装
Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...
- ThinkPHP6.0 + Vue + ElementUI + axios 的环境安装到实现 CURD 操作!
官方文档地址: ThinkPHP6.0: https://www.kancloud.cn/manual/thinkphp6_0/1037479 ElemetUI: https://elemen ...
- vue开发搭建(npm安装 + vue脚手架安装)
一.概念 1.npm: Nodejs下的包管理器. 2.webpack: 它主要的用途是通过CommonJS的语法,把所有浏览器端需要发布的静态资源,做相应的准备,比如资源的合并和打包. 3.vue ...
随机推荐
- WEBGL学习【九】立方体贴不同的纹理
<html> <!--开始实现一个三维街景的渲染效果--> <head> <meta http-equiv="Content-Type" ...
- [luogu P1962] 斐波那契数列(带快速幂矩阵乘法模板)
题目背景 大家都知道,斐波那契数列是满足如下性质的一个数列: • f(1) = 1 • f(2) = 1 • f(n) = f(n-1) + f(n-2) (n ≥ 2 且 n 为整数) 题目描述 请 ...
- 实现路由器自动登录校园网(edu)
准备工作: (1)一个可以刷openwrt固件的路由器,如大多人使用的crazybox版本的路由. (2)一个可用的edu账号. (3)一个浏览器(firfox,chrome) 下面开始: 一:刷op ...
- 探索Python的多态是怎么实现的
多态是指通过基类的指针或者引用,在运行时动态调用实际绑定对象函数的行为. 对于其他如C++的语言,多态是通过在基类的函数前加上virtual关键字,在派生类中重写该函数,运行时将会根据对象的实际类型来 ...
- struts配置之namespace
- 工具-VS CODE快捷键
快捷键 Ctrl+P 通过文件名或者标签名导航 Ctrl+Tab 在前一个文件和当前文件间切换 F1 打开全局命令 Ctrl+Shift+O will let you navigate ...
- mongodb 学习笔记 07 -- 数据备份、恢复
mongoexport 导出json或者csv格式 mongoimport 导入json或者csv mongodump 导出二进制bson结构数据以及索引信息 mongorestore 导入二进制文件 ...
- 用PHP去实现静态化
我们在PHP站点开发过程中为了站点的推广或者SEO的须要,须要对站点进行一定的静态化,这里设计到什么是静态页面,所谓的静态页面.并非页面中没有动画等元素,而是指网页的代码都在页面中,即不须要再去执行P ...
- HTML5开发移动web应用——Sencha Touch篇(8)
DataView是Sencha Touch中最重要的组件,用于数据的可视化.数据可视化的重要性不言而喻,能够讲不论什么数据以形象的方式展示给用户. 眼下,怎样更好地可视化是很多公司或框架都在追求的. ...
- Android新手入门2016(8)--ListView之ArrayAdapter
本文来自肥宝传说之路,引用必须注明出处! ListView是Android中经常使用的控件. 什么是列表视图,让我们先看看图: watermark/2/text/aHR0cDovL2Jsb2cuY3N ...