mac-chrome下手动安装vue-devtools
废话就不多说,直接上安装步骤,一步一步来 => success
1.下载安装vue-devtools源文件
mkdir vuetools
cd vuetools git clone https://github.com/vuejs/vue-devtools.git
cd vue-devtools
npm install --registry=https://registry.npm.taobao.org
npm run build
2.修改manifest.json文件
cd vue-devtools
cd shells
cd chrome
vi manifest.json
// 修改persistent为true
3.将vue-devtools文件夹复制到Chrome插件文件夹中
// 大致在这个路径下:
~/Library/Application Support/Google/Chrome/Default // vue-devtools文件夹复制到Default下 // mac上找路径犯难了,可以随便打开一个文件 顶部 前往>前往文件夹>路径
4.将vue-devtools文件夹添加到浏览器扩展
// 在Chrome地址栏输入 chrome://extensions/
// 进入扩展程序页面,将文件夹拖入浏览器即可。
// 至此安装完成。安装成功后浏览器右上角会出现vue的图标,表示安装成功。 // 现在可以体验一下vue这个调试工具了。
后话:
对于安装Vue Devtools插件成功后使用提示Vue.js not detected,有可能是你引入了压缩版的vue.min.js,必须要引入vue.js才行喔。
其实早就了解过这个工具,之前在windows上安装过,没成功。所以一直也没有体验过。也是刚刚安装完成,方法当然也是参考了很多大神的思路,以上方法亲测可行,就说这么多吧,有问题一起交流。
mac-chrome下手动安装vue-devtools
* {display: table-row!important}
.MJXp-surd {vertical-align: top}
.MJXp-surd > * {display: block!important}
.MJXp-script-box > * {display: table!important; height: 50%}
.MJXp-script-box > * > * {display: table-cell!important; vertical-align: top}
.MJXp-script-box > *:last-child > * {vertical-align: bottom}
.MJXp-script-box > * > * > * {display: block!important}
.MJXp-mphantom {visibility: hidden}
.MJXp-munderover {display: inline-table!important}
.MJXp-over {display: inline-block!important; text-align: center}
.MJXp-over > * {display: block!important}
.MJXp-munderover > * {display: table-row!important}
.MJXp-mtable {vertical-align: .25em; margin: 0 .125em}
.MJXp-mtable > * {display: inline-table!important; vertical-align: middle}
.MJXp-mtr {display: table-row!important}
.MJXp-mtd {display: table-cell!important; text-align: center; padding: .5em 0 0 .5em}
.MJXp-mtr > .MJXp-mtd:first-child {padding-left: 0}
.MJXp-mtr:first-child > .MJXp-mtd {padding-top: 0}
.MJXp-mlabeledtr {display: table-row!important}
.MJXp-mlabeledtr > .MJXp-mtd:first-child {padding-left: 0}
.MJXp-mlabeledtr:first-child > .MJXp-mtd {padding-top: 0}
.MJXp-merror {background-color: #FFFF88; color: #CC0000; border: 1px solid #CC0000; padding: 1px 3px; font-style: normal; font-size: 90%}
.MJXp-scale0 {-webkit-transform: scaleX(.0); -moz-transform: scaleX(.0); -ms-transform: scaleX(.0); -o-transform: scaleX(.0); transform: scaleX(.0)}
.MJXp-scale1 {-webkit-transform: scaleX(.1); -moz-transform: scaleX(.1); -ms-transform: scaleX(.1); -o-transform: scaleX(.1); transform: scaleX(.1)}
.MJXp-scale2 {-webkit-transform: scaleX(.2); -moz-transform: scaleX(.2); -ms-transform: scaleX(.2); -o-transform: scaleX(.2); transform: scaleX(.2)}
.MJXp-scale3 {-webkit-transform: scaleX(.3); -moz-transform: scaleX(.3); -ms-transform: scaleX(.3); -o-transform: scaleX(.3); transform: scaleX(.3)}
.MJXp-scale4 {-webkit-transform: scaleX(.4); -moz-transform: scaleX(.4); -ms-transform: scaleX(.4); -o-transform: scaleX(.4); transform: scaleX(.4)}
.MJXp-scale5 {-webkit-transform: scaleX(.5); -moz-transform: scaleX(.5); -ms-transform: scaleX(.5); -o-transform: scaleX(.5); transform: scaleX(.5)}
.MJXp-scale6 {-webkit-transform: scaleX(.6); -moz-transform: scaleX(.6); -ms-transform: scaleX(.6); -o-transform: scaleX(.6); transform: scaleX(.6)}
.MJXp-scale7 {-webkit-transform: scaleX(.7); -moz-transform: scaleX(.7); -ms-transform: scaleX(.7); -o-transform: scaleX(.7); transform: scaleX(.7)}
.MJXp-scale8 {-webkit-transform: scaleX(.8); -moz-transform: scaleX(.8); -ms-transform: scaleX(.8); -o-transform: scaleX(.8); transform: scaleX(.8)}
.MJXp-scale9 {-webkit-transform: scaleX(.9); -moz-transform: scaleX(.9); -ms-transform: scaleX(.9); -o-transform: scaleX(.9); transform: scaleX(.9)}
.MathJax_PHTML .noError {vertical-align: ; font-size: 90%; text-align: left; color: black; padding: 1px 3px; border: 1px solid}
-->
mac-chrome下手动安装vue-devtools的更多相关文章
- 怎样在Chrome浏览器上安装 Vue Devtools 扩展程序
第一步: 前往 GitHub 下载 Vue Devtools 项目文件 https://github.com/vuejs/vue-devtools 注意: 1. 将分支切换为 master 2. 下载 ...
- 在google chrome浏览器上安装 Vue Devtools工具
[转]https://www.cnblogs.com/tanyongli/p/7554045.html Vue.js devtools是基于google chrome浏览器的一款调试vue.js应用的 ...
- 【vue】chrome已安装Vue Devtools在控制台却无显示
chrome已安装Vue Devtools在控制台却无显示的解决: 在点亮Vue Devtools图标后,控制台没有vue解读显示. 原因:脚手架配置NODE_ENV直接定义为了production版 ...
- Vue安装Vue Devtools调试工具提示 Error: Cannot find module '@vue-devtools/build-tools' 解决办法
我看网络上面安装Vue Devtools 调试工具的步骤几乎都是按照文章链接里的步骤进行安装, 但是在最终执行编译命令的时候 :npm run build ,提示如下错误: 尝试了很多方法,都不能解决 ...
- Ubuntu 14.04 下手动安装Firefox的Flash插件
有时候我们不得不採用手动安装一些软件. Ubuntu 14.04 下手动安装Firefox的Flash插件有下面几步 1. 下载Flash插件 下载地址为http://get.adobe.com/cn ...
- ubuntu14.04下手动安装eclipse
ubuntu14.04下手动安装eclipse 第一步: 安装jdk 第二步: 下载eclipse,假设下载的文件文件名为eclipse.tar.gz 第三步: 解压 sudo -zxvf ./ecl ...
- ubuntu14.04 下手动安装java jdk
ubuntu14.04 下手动安装java jdk 第一步: 下载jdk.tar.gz (这里假设下载的文件名为jdk.tar.gz) 第二步: 解压 sudo tar -zxvf ./jdk.tar ...
- windows下手动安装composer并配置环境变量
windows下手动安装composer并配置环境变量 转载地址: https://my.oschina.net/7sites/blog/209997 之前发表过一篇如何为composer设置代理 ...
- windows下手动安装 Apache+php+mysql
PHP 为什么先说php,因为apache的配置要写入php的一些路径 http://php.net/downloads.php 选择windows donwload 选择Thread Safe的版 ...
随机推荐
- AndroidStudio设置应用图标
两种方法: 第一种:打开new -->Image Asset更换自己的图标一直保存即可. 第二种:在 res\drawable目录下 放置图标;修改 AndroidManifest.xml : ...
- Kubernetes 的 Client Libraries 的使用
说明 kubernetes 估计会成为 linux 一样的存在,client-go 是它的 go sdk,client-go/examples/ 给出了一些用例,但是数量比较少. api Resour ...
- 企业级自动化运维工具应用实战ansible
公司计划在年底做一次大型市场促销活动,全面冲刺下交易额,为明年的上市做准备.公司要求各业务组对年底大促做准备,运维部要求所有业务容量进行三倍的扩容,并搭建出多套环境可以共开发和测试人员做测试,运维老大 ...
- DoD与TCP/IP
DoD与TCP/IP都是协议栈. 什么是协议栈? 就是一套软件,默认安装完Windows就有,可以卸载再安装.把他卸载了,你就不能上网. 数据的封装以及解封装有网卡以及绑定的TCP/IP协议栈完成 A ...
- 《流畅的Python》Data model(数据/对象模型)
第一章 Data model ⚠️整本书都是讲解Data model,第一章是一个概述. ⚠️不适合初学者.因为special method和meta programming技巧只是Python代码的 ...
- canvas制图学习
<!DOCTYPE html> <html lang="zh-en"> <head> <meta charset="UTF-8& ...
- linux实操_shell
简单shell编写: 执行方式: (1)推荐 (2)不推荐
- Ubuntu安装依赖文件
我们在安装软件的时候,有时会出现由于依赖的软件没有被安装,会导致软件安装的失败,其实我们可以用命令来安装依赖的软件,这里以Ubuntu为例进行说明. 我在安装wps-office的时候,显示安装成功了 ...
- 第92题:反转链表II
一. 问题描述 反转从位置 m 到 n 的链表.请使用一趟扫描完成反转. 说明: 1 ≤ m ≤ n ≤ 链表长度. 示例: 输入: 1->2->3->4->5->NUL ...
- 再论i++ ++i
#include <stdio.h> int main(void) { char acData[5] ={'A','B','C','D','E'}; char *pcData = NULL ...