mac-chrome下手动安装vue-devtools

摘要:
//至此安装完成。安装成功后浏览器右上角会出现vue的图标,表示安装成功。//现在可以体验一下vue这个调试工具了。其实早就了解过这个工具,之前在windows上安装过,没成功。所以一直也没有体验过。也是刚刚安装完成,方法当然也是参考了很多大神的思路,以上方法亲测可行,就说这么多吧,有问题一起交流。

废话就不多说,直接上安装步骤,一步一步来 => 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

免责声明:文章转载自《mac-chrome下手动安装vue-devtools》仅用于学习参考。如对内容有疑问,请及时联系本站处理。

上篇Vue 1-- ES6 快速入门、vue的基本语法、vue应用示例,vue基础语法linux 新添加的硬盘格式化并挂载到目录下下篇

宿迁高防,2C2G15M,22元/月;香港BGP,2C5G5M,25元/月 雨云优惠码:MjYwNzM=

相关文章

vue 项目用webpack打包后运行后找不到.ttf及.woff文件

参考:https://www.cnblogs.com/me168/archive/2004/01/13/10424955.html webpack.base.config 文件中 修改前: { test: /.css$/, use: ExtractTextPlugin.extract({ use: ['css-loader?minimize', 'a...

谷歌Google Chrome浏览器打开新的标签页设置指定固定网址

谷歌Google Chrome浏览器打开新的标签页设置指定固定网址 一. 下载插件:     下载地址:https://files-cdn.cnblogs.com/files/hooly/newtabredirect.zip  二. 使用方法:   1. 首先用户点击谷歌浏览器右上角的自定义及控制按钮,在下拉框中选择设置:          2. 在打开的...

【原】无脑操作:Chrome浏览器安装Vue.js devtool

学习Vue.js时,Chrome浏览器安装Vue.js devtool能很方便的查看Vue对象、组件、事件等。 本文以Chrome浏览器插件Vue.js devtools_3.1.2_0.crx的安装为例。 步骤: 1、打开Chrome浏览器,右上角找到“自定义及控制Google Chrome”图标。 2、点击图标,找到“更多工具”菜单项下的“扩展程序”(...

vue-构建app项目

以下记录vue-cli 3构建app项目的步骤。 一、初始化配置,并运行启动app 1、安装nodeJS,git ,配置环境,Vue CLI 3.x 需要 Node.js 8.9 或更高版本 (推荐 8.11.0+)。 2、安装vue-cli ,命令:npm install -g @vue/cli 3、创建项目:vue create mapp-demo 推...

vue发布IIS踩坑记

步骤一:复制文件 把build之后的文件(dist文件夹)拷贝到IIS存放网站文件的目录 步骤二:在IIS中新建站点  在"网站"执行鼠标右键,选择添加网站。 网站名称:按照用途或者项目起名即可 应用程序池:部署前端项目,这个可以忽略,任意选择即可 内容目录:网站存放的路径,最好以英文命名 端口:端口自己设置即可 步骤三:访问网站  访问网站可以在II...

openlayers集成到vue开发

openlayer初步加载地图 vue项目搭好后,直接用node js安装ol, 安装好后可以看看安装的版本;我用的是5..2的版本 然后看官网相对应版本的文档,都是英文文档; 官方文档: http://openlayers.org/en/latest/apidoc/ 然后引入所需要的js; 先加载出地图: 效果图: 使用离线地图时,重点注意的...