VUE.js devtool 安装简易教程(转)

最简便的方法是用FQ来通过google应用商店进行安装,但是大多数人还是处在非FQ的状态

尝试过安装Node的方法来安装,但是极其不建议用这个方法安装,非常麻烦,而且必须要有node的基础,非常不接地气

下面来一个最简便的方法(送给伸手党):

查看过很多博客大多数都是,要安装Vue-Devtools,在一个github下面用git clone或者手动下载一个叫做vue-devtools-master的文件。然后呢,你就要用npm进行install,然后再npm install build。所以这意味着你又要去找npm来装,你会发现,最简便的方法就是下一个集成的node.js。一番辛苦了之后,你就会发现npm安装好了之后,npm install build又会出现一大串的问题。请问哪有那么多时间去google,baidu这些问题?你要的只是简单的安装一个的调试工具,而你又不想FQ。Here we are:

上GitHub,下载一个已经用npm处理过的Devtools源码,而且已经给你配置好了manifest.json和webpack.config.js文件,已经处理好了,拿来就用。啥也不说了,直接到我的GitHub上找:链接

下下来之后打开google浏览器,输入地址chrome://extensions/ ,点击加载已解压的扩展程序

进入到Chrome文件夹下,点击确定:

我这里是把整个Vue-Devtools适配所有的浏览器源文件都安装了,而你只需要要chrome浏览器的源码就行,所以直接用我GitHub上的Chrome文件夹就行,点击确定

确定完了之后就会发现链接栏的右边有个V的标志,证明已经成功,但是此时会有很多人F12之后依然在调试界面看不到Vue,有可能是因为你写的程序引用的vue文件是一个vue.min.js文件,是个压缩文件,这个压缩文件是默认不支持调试的,具体怎么调支持调试就请自行baidu吧!这里只需要把你引入的文件的源码,编程Vue.js的就行,不要压缩版的。如果还不行,可以尝试下关闭浏览器再打开。

这样就已经安装调试成功了。
————————————————
版权声明:本文为CSDN博主「OnMy22」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/weixin_38654336/article/details/80790698

原文地址:https://www.cnblogs.com/yibey/p/12048537.html

时间: 2024-08-26 05:40:56

VUE.js devtool 安装简易教程(转)的相关文章

windows下vue.js开发环境搭建教程

这篇文章主要为大家详细介绍了windows下vue.js开发环境搭建教程,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 最近,vue.js越来越火.在这样的大浪潮下,我也开始进入vue的学习行列中,在网上也搜了很多教程,按着教程来做,也总会出现这样那样的问题(坑啊,由于网上那些教程都是Vue.js 1.x版本的,现在用Vue.js 的构建工具都已经升级到2.0版本了),经过了一段时间的摸索和看官方的教程和api,才了解到2.0版本在1.0版本的基础上做了好多调整,废弃了好多api.废话不多说

vue的测试(Vue.js devtool)

1. 安装chrome插件:Vue.js devtools(https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd?hl=zh-CN) 2. 下载vue-devtools (https://github.com/vuejs/vue-devtools) 3. 修改文件:vue-devtools-master/shells/chrome/manifest.json 1 2 3

Win10中Vue.js的安装和项目搭建

一. 提前准备工作 1.Node.js环境 2.Windows10 3.npm(前端包管理工具) 4.webpack(前端资源加载/打包工具) 二. 开始安装 1..下载并安装Node.js 下载地址:https://nodejs.org/en/download/ 2.在cmd中查看node.js是否安装成功,以及是否安装npm 3.由于npm安装资源时速度慢,推荐使用淘宝的镜像及其命令cnpm,安装使用介绍参照:使用淘宝NPM镜像. #查看版本 npm -v #升级npm cnpm insta

一款简单而不失强大的前端框架——【Vue.js的详细入门教程①】

↓— Vue.js框架魅力 —↓ 前言   Vue.js 是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.Vue 只关注视图层并且采用自底向上增量开发的设计. Vue.js作为一个后起的前端框架,借鉴了Angular .React等现代前端框架/库的诸多特点,取得了相当不错的成绩.Vue.js 自身不是一个全能框架——它只聚焦于视图层.因此它非常容易学习,非常容易与其它库或已有项目整合.另一方面,在与相关工具和支

Node.js下载安装图文教程

一.Node.js是什么? Node.js是前端js代码的一个包管理工具,类似于javar的Maven或.net的Nuget 二.Node.js的下载与安装 1.官网下载地址:https://nodejs.org/zh-cn/ 2.双击打开,开始安装 三.Node.js的验证 node -v npm -v 四.npm镜像仓库源配置(用国内的源可以提高下载速度) npm config set registry http://registry.npm.taobao.org/ 原文地址:https:/

vue.js的安装

使用nodejs安装Vue-cli 1.安装完成node,node有自带的npm,可以直接在cmd中,找到nodeJs安装的路径下,进行命令行全局安装vue-cli.(npm install --global vue-cli) 我的是安装在c盘 ----想安装速度快点,可以使用淘宝镜像如下 ----通过config命令    npm config set registry https://registry.npm.taobao.org                  npm info unde

Vue.js学习之——安装

Vue.js的安装方式有三种: 1.script引入 2.CDN 3.NPM 前两种不细说,重点讨论第三种--NPM安装 Vue.js提供了一个名为Vue-cli的官方命令工具,使用之前先进行如下准备工作: 1.安装nvm(Node Version Manager),简单来说就是一个管理node.js版本的控制器. 2.安装npm(Node package Manager),实际上就是个node包管理器.事实上在通过nvm安装node的时候,npm就已经附带了. 完成上述准备之后可以安装Vue了

Vue.js开发环境搭建(安装过程遇到的问题)

网络上关于Vue.js的安装过程有很多介绍,这里不多赘述,这里只是记录自己安装过程和遇到的问题 1 首先安装node.js 到官网下载node.js安装包,安装过程和一般软件没有区别.安装完成后到终端查看版本号,若如下图所示,表示安装成功. 2.node.js环境变量新建 其实安装完node,就自动在path里增加环境变量,但是为了以后的本地部署项目,我们需要找到node.js的安装根目录,在当中新建"node_global"和"node_cache"两个文件夹.

vue.js三种安装方式

Vue.js(读音 /vju?/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手,还便于与第三方库或既有项目整合. 下面介绍三种 Vue.js 的安装方法: 独立版本 我们可以在Vue.js的官网上直接下载vue.js,并在html中通过<script>标签中引用.<script src = ../vue.js> </script> 开发环境不要使用最