electron-vue 黑屏/白屏 devTools was disconnected from the pageonce page is reloaded devtools will automa

最新推荐文章于 2023-08-17 17:05:58 发布
最新推荐文章于 2023-08-17 17:05:58 发布
阅读量5.1k 收藏 1
点赞数
分类专栏： electron 文章标签： electron 前端
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/YaRuu/article/details/125543561
版权

：属于electron.js新手

目录

electron版本回退

这个问题定位是V8崩溃，DevTools 将显示以下信息
DevTools was disconnected from the page.（DevTools 与页面断开连接） Once page is reloaded, DevTools will automatically reconnect.（页面重新载入后，DevTools 将自动重新连接）
 

可以参考文档解决 定位问题

Chromium日志可以通过ELECTRON_ENABLE_LOGGING环境变量启用。 有关更多信息，请参见环境变量文档。

或者，可以传递命令行参数--enable-logging。 更多信息请查看命令行开关文档

我遇到这个问题最后定位是 node环境及其他版本过高问题，不兼容部分功能，

### 环境
node v10.13.0 32bit
vs2015
node-gyp v6.1.0

electron版本回退

最简单办法就是 在node_module中找到electron包，重新安装低版本 electron 包

cnpm install electron@^6.0.1 -g

菜鸟lady
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Electron打包的桌面应用程序，运行中程序黑屏、白屏等渲染进程崩溃问题解决
青清一水澈
03-17 6848
Electron打包的桌面应用程序，运行中程序黑屏、白屏等渲染进程崩溃问题解决
vue中echarts图表大小适应窗口大小且不需要刷新案例
10-15
主要介绍了vue中echarts图表大小适应窗口大小且不需要刷新案例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
秒解DevTools was disconnected(devtools与网页连接断开)
我不喜欢这个世界
01-08 9967
DevTools was disconnected from the page. Once page is reloaded,DevTools will automatically reconnect（devtools与网页连接断开），这个是新版本兼容性的问题，不用来回找方案解决这个问题，只能切换到旧版本的，直接卸载现在的版本，卸载时候保留数据，旧版本安装上你原有的书签啥的一样存在。链接：https://pan.baidu.com/s/1THl8g-Tw26Ra1Lk_fgezyg?
selenium自动化DevTools连接断开问题
Orange_ysen的博客
07-12 4639
2、禁用沙盒模式：启用无头模式时，谷歌浏览器会在沙盒模式下运行，这会导致DevTools连接断开。3、禁用插件：其他可能的冲突：其他正在运行的程序或插件可能会干扰Selenium与DevTools之间的通信，关闭其他可能干扰的程序或插件。4. 其他问题：暂未找到可能出现的其他原因，可以通过不同浏览器火狐、edge等看看是否重现。3. 网络问题：确保网络连接正常，没有任何防火墙或代理设置干扰与浏览器的通信。1、增加连接超时时间：在创建浏览器实例时，增加连接超时时间。增加连接超时时间： 设置的3秒可增加时间。
electron-vue-vite:Electron、vue3、vite2、ant-design-vue2 整合
05-02
electron-vue-vite Electron + vue3 + vite2 + ant-design-vue2 整合 :bug: 已知问题 项目打包后仍有问题 待解决... 暂时通过集成 webpack 解决打包问题 How and Why 写这个 Demo 项目主要有两个目的 [email protected] 发布了，想试试新功能 工作中用的 umi+electron 项目大了，启动速度并不理想； 用 vite 试试，算一个储备方案 ^_^ Command npm run dev npm run build 如果只需要最基础的集成 Demo 请使用 或 分支 Note 踩坑记 import { write } from 'fs' 的这种形式会被 vite 编译成 /@modules/fs?import const { write } = require('fs') 这种形式就能用了 :winking_face: const {
Chrome “DevTools was disconnected from the page”
热门推荐
小石猴的博客
05-23 2万+
Chrome  “DevTools was disconnected from the page” 最近在调试项目的时候 Chrome出现了“DevTools was disconnected from the page” 这样的错误并且崩溃了，经过多方查证发现是浏览器版本问题，建议下载安装谷歌官方稳定版本，不要通过第三方下载，我用的360下载的经常更新重装官方稳定版后正常了。...
其他——调试时chrom崩溃
GIS特战兵
12-08 3565
问题：在调试的时候页面经常崩溃，报错原因时内存溢出，在调试面板弹出如下信息： DevTools was disconneced from the page. Once page is reloaded,DevTools will DevTools与页面断开连接。页面重新加载后，DevTools将重新链接。 解决：安装合适的chrom 因为同事的电脑配置好一些从没出现这情况，所以我一直以为是自己电脑配置太低，直到发现自己chrom不是64位的就还了一个然后问题就没有了。 哎小问
devtools was disconnectedfrom the page
周二也被占用
06-12 1万+
谷歌浏览器调试程序时报了这个错，最后发现是浏览器兼容性问题，升级到最新的版本 61.0.3124.10（正式版本）就没问题了 旧版本的58和59都有问题。 所以调试前端代码（js css）的时候如果有问题，一定要一步一步往下走，同时检查其他浏览器是不是有相同问题。
Electron.js指南——应用程序调试
幽灵 逐梦--专栏
10-20 1293
应用程序调试 每当您的Electron应用程序没有按照您希望的方式运行时，一系列调试工具可能会帮助您发现编码错误，性能瓶颈或优化机会。 渲染进程 Chromium Developer Toolset是调试单个渲染器进程的最全面的工具。它适用于所有的渲染过程，包括的实例BrowserWindow，BrowserView以及WebView。您可以通过在实例的openDevTools()上调用API以编程方式打开它们webContents： const { BrowserWindow } = r..
Electron-Vue学习篇—1、electron-vue项目打包后打开新窗口空白
Code P的博客
08-31 1726
一、场景描述 在本地运行electron-vue项目时，打开新窗口有显示内容，但经过打包之后，重复同样的操作，新窗口空白，打开Developer Tools，提示"DevTools was disconnected from the page" 二、解决思路 出现"DevTools was disconnected from the page"的提示，说明该页面没有被找到，那就是页面的路径配置错误 1、查看路由配置，采用的是hash模式，这没问题 const router = new VueRouter({
Electron Vue-具有vue-cli脚手架，常见Vue插件，electron-packager / electron-builder，单元/ e2e测试，vue-devtools和webpack的Electron＆Vue.js快速入门样板。-Vue.js开发
05-27
用vue（听起来很像）构建用于电子应用的样板。 概述此项目的目的是删除使用vue构建的电子应用样板（听起来很像）。 概述该项目的目的是消除使用vue手动设置电子应用程序的需要。 electronic-vue充分利用了vue-cli的脚手架，带有vue-loader，electron-packager或electronic-builder的Webpack以及一些最常用的插件，如vue-router，vuex等。 在此处查看详细文档。 您会在此样板中找到的东西...
electron-vue-serialport:electron-vue serialport 串口读取
05-24
项目参考 项目运行环境 1，必须安装nodejs node下载地址- 2，安装node-gyp node-gyp是用来编译c++模块的工具，这里用来编译serialport， node-gyp的github文档- 全局安装 npm install -g node-gyp 通过命令npm install --global --production windows-build-tools,但是要注意 的是必须以管理员的身份启动CMD窗口 安装完成之后执行一下命令 npm config set msvs_version 2017 其他安装方法……百度 项目的安装与使用 clone到本地 # clone到本地 git clone https://github.com/648702308/electron-vue-serialport.git # 切换到项目目录 npm install`或者`cnp
electron-vue-vite-webpack:Electron、vue3、vite2、webpack5、ant-design-vue2 整合
05-17
电子vue-vite-webpack Electron + vue3 + vite2 + webpack5 + ant-design-vue2 如何和为什么 Vite是未来的脚手架 在开发期间使用“拜访”以保持快速启动的优势 使用“ webpack”解决包装期间的包装问题 命令 npm run dev npm运行构建 执照
electron-vue + vue-cli + element-ui 实时热更新版v12.0.4框架.rar
05-06
electron-vue + vue-cli + element-ui 实时热更新版，electronv12.0.4框架，打包好的框架，拿来即用，实时热更新，提高开发3倍效率
chrome在线调试Inspect空白问题
08-23
解决chrome下device:inspect出现空白页，替换文件就可以了
Electron项目中通过electron-vue + electron-builder + electron-updater实现远程更新（包含源码）
04-01
Electron项目中通过electron-vue + electron-builder + electron-updater实现远程更新（包含源码）
nuxt-devtools:将独立（电子）vue-devtools与nuxt一起使用
05-23
Nuxt-Devtools安装安装2个包装yarn global add @vue/devtoolsyarn add @ec-nordbund/nuxt-devtools -D 将此添加到您的nuxt.config.json中： export default { buildModules : [ "@ec-nordbund/nuxt-devtools" ] ,} ;...
Electron app在部分windows7上运行黑屏或者不显示
youyudexiaowangzi的专栏
07-12 3716
据传是gpu的问题，electron不会自己判断硬件是否支持加速，只会自己默默的出bug， 解决方法一： 启动的时候传入参数--disable-gpu， 一般这种情况下可以右键快捷方式，在目标那里加上 --disable-gpu, 或者用程序启动electron程序，启动的时候加上参数 --disable-gpu 解决方法二： 在创建出窗口之前调用app.disableHardwareAcceleration()，这样会禁用硬件加速，就能正常显示了 ...
electron在最小化窗口后，任务栏右键关闭再托盘唤起黑屏的解决方法
AzeShinja的博客
08-17 1242
使用restore方法还原最小化窗口后展示黑屏的解决方方法
electron-vue electron-log
最新发布
12-15
electron-vue 是一个基于 electron 构建的 vue.js 框架。它结合了 vue.js 和 electron，可以让开发者使用 vue.js 的组件化开发方式来构建跨平台的桌面应用程序。使用 electron-vue 可以快速搭建 electron 应用的基础结构，并且利用 vue.js 的特性来开发界面和逻辑。 而 electron-log 是一个专为 electron 应用程序设计的日志模块。它为 electron 应用提供了方便的日志记录功能，可以将日志输出到文件或控制台，并且支持日志的级别和格式设置。electron-log 还可以方便地集成到 electron-vue 项目中，帮助开发者更好地管理和记录应用程序的日志信息。 electron-vue 和 electron-log 的结合使用，可以让开发者更加轻松地构建和管理 electron 应用程序。开发者可以利用 electron-vue 来快速搭建应用的界面和逻辑，同时使用 electron-log 来记录和管理应用程序的日志信息。这种组合可以提高开发效率，让开发者更加专注于应用程序的功能和用户体验。同时，electron-log 也可以帮助开发者更好地监测应用程序的运行状态，及时发现和解决问题，从而提高应用程序的稳定性和可靠性。因此，electron-vue 和 electron-log 是非常适合 electron 应用开发的工具，可以帮助开发者更好地完成应用程序的开发和维护工作。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值