vue-devtools工具的安装和使用

介绍：

1、从github拉取开发工具源码

2、在vue-devtools目录下安装依赖包

3、执行npm run build

4、打开Chrome浏览器，选择更多工具->扩展程序

5、将刚才看到的chrome目录直接拖拽到上述页面中，就可以看到上成功加载了Vue开发工具

6、打开一个Vue应用的页面

介绍：

在使用 Vue 时，我们推荐在你的浏览器上安装 Vue Devtools。它允许你在一个更友好的界面中审查和调试 Vue 应用。

1、从github拉取开发工具源码

2、在vue-devtools目录下安装依赖包

cd vue-devtools

npm install

3、执行npm run build

看到如下界面，表示成功

此时在vue-devtools目录下会出现一个shells目录，其中有一个chrome目录

4、打开Chrome浏览器，选择更多工具->扩展程序

5、将刚才看到的chrome目录直接拖拽到上述页面中，就可以看到上成功加载了Vue开发工具

6、打开一个Vue应用的页面

然后开启对开发工具的支持，此时在原来Chrome的开发者工具中就会出现一个名字为Vue的tab，通过这个tab就可以看到当前Vue应用运行的一些信息，方便进行调试。

vue-devtools工具的安装和使用相关推荐

Redux DevTools工具的安装
什么是Redux DevTools? Redux DevTools是一款由Redux官方提供的浏览器调试工具,可以让我们更加方便的对Redux保存的状态进行追踪调试. 大白话就是:类似于Vuex. 完 ...
在浏览器上安装 Vue Devtools工具
Vue.js devtools是基于google chrome浏览器的一款调试vue.js应用的开发者浏览器扩展,可以在浏览器开发者工具下调试代码. 1)首先在github下载devtools源码,地 ...
Vue插件开发工具的安装以及解决Vue Devtools安装后语法启动，图标仍然不亮的问题
插件安装: 1.极简插件安装地址:https://chrome.zzzmh.cn/index 安装详细步骤看下篇文档解决问题第一: 1.找到扩展程序的安装目录.如图片所示: 2.用记事本打开,或者 ...
【进阶篇】Vue Devtools——vue开发调试神器
工欲善其事,必先利其器,vue2.0进阶系列的知识更接近我们的实际开发所需,在开发过程中,有个好的调试工具是事半功倍的,Vue Devtools就是我们选择的调试工具,它是一款chrome浏览器的插件 ...
vuejs之Vue Devtools
Vue Devtools大法好这是一篇小白friendly教程 Vue Devtools是一款谷歌浏览器插件,专门为调试vue而设计.假设你做了一个vue应用,当你在调试的过程中,打开的控制台是这样 ...
Vue Devtools 安装
Vue Devtools 是Chrome 浏览器插件,用来调试Vue的,能够更直观.更友好的调试Vue应用下载地址:https://github.com/vuejs/vue-devtools#vue ...
Vue Devtools安装（谷歌浏览器插件：）
vue安装: # 最新稳定版 $ npm install vue # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新 ...
超详细Vue Devtools的下载和安装——Vue的调试工具
在使用 Vue 时,我们推荐在浏览器上安装 Vue Devtools. Vue Devtools 是 Vue 官方发布的调试浏览器插件,可以安装在 Chrome 和 Firefox 等浏览器上,直接内 ...
安装vue Devtools学习记录
在学习vue之前,建议使用Google chrome上安装vue devtools拓展工具.vue devtools提供界面供我们查看vue组件和全局状态管理器vuex中记录的数据. 有条件的可以直接 ...
windows下载安装Vue开发者工具(VueDevtools)，同时支持vue2.0和vue3.0两个版本
前言 vue开发者工具可以帮助我们提高开发效率,如果不安装控制台老是现在这些东西,对我这种强迫症患者来说痛苦至极,下面我就介绍下我的安装步骤下载安装首先进入vue官网找到如下位置然后就会进入gi ...

vue-devtools工具的安装和使用

介绍：

1、从github拉取开发工具源码

2、在vue-devtools目录下安装依赖包

3、执行npm run build

4、打开Chrome浏览器，选择更多工具->扩展程序

5、将刚才看到的chrome目录直接拖拽到上述页面中，就可以看到上成功加载了Vue开发工具

6、打开一个Vue应用的页面

vue-devtools工具的安装和使用相关推荐

最新文章

热门文章