Electron开发使用Vue Devtools
转自 [https://orchidflower.oschina.io/2017/03/29/Using-Vue-Devtools-in-Electron/]
2.2 安装步骤
首先在Chrome中安装Vue Devtools;
在Chrome中打开about:extensions,并且开启开发者模式,这样就可以获取扩展程序的ID,记住这个ID,例如我这边的值是nhdogjmejiglipccpnnnanhbledajbpd,下面需要用到。
打开文件管理器或者Finder,导航到Chrome保存扩展程序的文件夹:
在Windows上:%LOCALAPPDATA%\Google\Chrome\User Data\Default\Extensions
在Linux可能是(看不同的版本):
~/.config/google-chrome/Default/Extensions/
~/.config/google-chrome-beta/Default/Extensions/
~/.config/google-chrome-canary/Default/Extensions/
~/.config/chromium/Default/Extensions/
在Mac上是:~/Library/Application Support/Google/Chrome/Default/Extensions
在上面的文件夹中找到刚才获取的ID对应的那个文件夹,打开,记录下文件夹中存在的文件夹名字,一般是版本号。这样就获取了最终需要使用的文件夹地址。例如我这边这个地址是:~/Library/Application Support/Google/Chrome/Default/Extensions/nhdogjmejiglipccpnnnanhbledajbpd/3.1.2_0。
在Electron应用中添加如下代码:
app.on('ready', createWindow)
function createWindow() {
...
// Open the DevTools.
if (process.env.NODE_ENV === 'development') {
BrowserWindow.addDevToolsExtension('/Users/ybx/AppData/Local/Google/Chrome/User Data/Default/Extensions/nhdogjmejiglipccpnnnanhbledajbpd/4.1.5_0')
}
...
}
Electron开发使用Vue Devtools的更多相关文章
- Vue 全家桶 + Electron 开发的一个跨三端的应用
代码地址如下:http://www.demodashi.com/demo/11738.html GitHub Repo:vue-objccn Follow: halfrost · GitHub 利用 ...
- 桌面应用之electron开发与转换
桌面应用之electron开发与转换 一,介绍与需求 1.1,介绍 1. Electron简介 Electron是用HTML,CSS和JavaScript来构建跨平台桌面应用程序的一个开源库. Ele ...
- 【vue】chrome已安装Vue Devtools在控制台却无显示
chrome已安装Vue Devtools在控制台却无显示的解决: 在点亮Vue Devtools图标后,控制台没有vue解读显示. 原因:脚手架配置NODE_ENV直接定义为了production版 ...
- Vue安装以及Vue项目创建以及Vue Devtools安装
这几天一直在学习Vue.js框架. 因为以前没有前端项目的经验,也没学过什么前端框架,所以,对于vue.js的学习有些不知所措. 在vue.js官网看教程,按照教程指点,可以不用脚手架开发,也可以搭建 ...
- electron 开发拆坑总结
electron 总结 前言 有一个web项目需要用客户端来包装一下 项目的主要业务都在服务器上 所以项目的大多数功能都用url 地址来访问: 客户端登陆界面在本地 打包客户端的本地登陆界面 做为登陆 ...
- 使用electron开发桌面级小程序自动部署系统
那一天我二十一岁,在我一生的黄金时代,我有好多奢望.我想爱,想吃,还想在一瞬间变成天上半明半暗的云,后来我才知道,生活就是个缓慢受锤的过程,人一天天老下去,奢望也一天天消逝,最后变得像挨了锤的牛一样. ...
- Electron 打开开发者工具 devtools
转载:http://newsn.com.cn/say/electron-devtools.html 在electron开发的过程中,可以用代码控制打开自带chrome的devtools开发者工具,进而 ...
- vue devtools无法使用
vue devtools无法使用 一.总结 一句话总结: 没显示vue devtools调试工具的原因是用了生产环境的版本或是压缩的vue版本,或是没有勾选:允许访问文件网址 二.vue调试工具Dev ...
- Chrome Vue Devtools插件安装和使用
安装:fq后在chrome应用商店搜索 Vue Devtools并安装,安装成功后浏览器右上角有vue的图标 安装完毕后,打开含有vue框架的网站,这是vue图标会变亮,进入开发者工具,再右侧vue选 ...
随机推荐
- SpringMVC以POST提交表单中文乱码解决方案。
在web.xml中添加字符集过滤器: <filter> <filter-name>characterEncodingFilter</filter-name> < ...
- 记一次nginx配置伪静态规则
server { listen 80; server_name sss.cn; root "root/"; location / { index index.html index. ...
- Java基础/网络经验
一.Java新特性好文--掘金 1.Java8 新特性指导手册 2.Java 11 已发布,String 还能这样玩 二.Java避坑 1.为什么阿里巴巴不建议在for循环中使用"+&quo ...
- 五、Kubernetes_V1.10集群部署-master-部署组件
一.配置apiserver 1.生成启动文件 cat > /usr/lib/systemd/system/kube-apiserver.service <<EOF [Unit] De ...
- 写出java.lang.Object类的六个常用方法
java是面向对象的语言,而Object类是java中所有类的顶级父类(根类). 每个类都使用Object类作为超类,所有对象(包括数组)都实现这个类的方法,即使一个类没有用extends明确指出继承 ...
- poj1061(扩展欧基里德定理)
题目链接:https://vjudge.net/problem/POJ-1061 题意:在一个首位相接的坐标轴上,A.B开始时分别位于X,Y处,每个单位时间向右移动m,n米,问是否能相遇,坐标轴长L. ...
- 重写移动端滚动条[iScroll.js核心代码]
最近写组件库的时后,发现这个滚动条是真的丑啊,决定重新撸一个滚动条: 首先咱们回顾一下移动端浏览器滚动条特性: 滚动条在开始滚动时渐显,滚动结束后渐隐 滚动条不占内容区宽度,悬浮固定 滚动条高度(深灰 ...
- bootstrap modal 闪退的办法
调用:
- Elasticsearch入门教程(一):Elasticsearch及插件安装
原文:Elasticsearch入门教程(一):Elasticsearch及插件安装 版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:h ...
- 定义一个Book类,有书名,价格,作者等信息。定义相应的方法来改变这些属性的值。定义一个方法来显示Book的所有信息。
package com.fs.test; public class Test { public static void main(String[] args) { // 先声明后赋值 book b;/ ...