如何创建 electron-vue 项目 解决electron无法运行

最新推荐文章于 2023-07-08 11:38:42 发布
最新推荐文章于 2023-07-08 11:38:42 发布
阅读量484 收藏 1
点赞数
分类专栏： electron 文章标签： vue.js electron javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/dccose/article/details/126886243
版权

如何创建 electron-vue 项目 electron无法运行

安装插件

  • 通过指令去安装 vue-cli-plugin-electron-builder 插件 会出现特别多的问题 所以建议使用 vue UI 界面去创建
  • vue UI创建vue项目 不会的可以看这篇：vueUI界面如何创建vue项目
  • 创建时特别需要注意的就是 一定要安装 vueRout 否则没办法打开多个窗口
    在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

打开编辑器 运行代码 命令：yarn electron:serve

  • 执行后如下
    • 1.可以在浏览器运行当前项目
    • 2.自动弹出一个应用窗口
      在这里插入图片描述
      在这里插入图片描述

如果等待很久也没有弹出应用窗口

  • 在当前项目中找到 路径为：src/background.js 的文件 修改代码
  • 删除或注释掉如下代码
  • 删除后直接同上运行即可
    在这里插入图片描述

在这里插入图片描述

就此结束 🙃🙃🙃

dccose
关注
  • 0
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue-cli使用vue-cli-plugin-electron-builder插件，运行时不启动electron程序？
fyt0215的博客
05-23 7334
记录一个关于vue-cli的小小小小坑儿 前段时间使用vue-cli-plugin-electron-builder插件配合vue-cli 3.x/4.x搭建electron项目。 在我的电脑上运行npm run electron:serve，正常启动electron应用： > vue-demo1@0.1.0 electron:serve D:\demo\vue-demo1 > vue-cli-service electron:serve INFO Starting development
关于electron-vue 安装、运行、打包报错踩坑日记
qq_33173954的博客
03-18 1117
测试 12122
关于electron-vue项目 运行npm run dev 跑不起来的解决
m-dididid的博客
06-18 1793
1下载node_modules electron-vue 项目下载后运行 npm install 2 cd到/node_modules/electron目录下 若node_modules下没有electron文件，则删除重新下载 运行 node install 3启动项目即可 npm run dev 运行过程中可能会遇到扩展插件vue-devtools安装不成功的问题，我找了好多解决办法都没解决，索性就重新安装了electron-vue，就没再有这个问题了。个人猜测可能是由于运行项目时不熟悉项目，运行
electron-vue升级electron到最新的版本后启动不起来，窗口一闪而过。
csx blog
08-17 815
升级electron到最新的版本后启动不起来，窗口一闪而过。
【Electron-Vue】构建桌面应用（40）- Electron程序未响应
chenqk_123的专栏
07-14 2094
在使用到Electron-vue开发桌面应用时，出现一个很头疼的问题，就是程序未响应。 具体问题描述：Electron程序调用hide隐藏后，当Electron应用长时间运行后，点击托盘图标调用show函数显示应用面板，会出现未响应的情况，并且会同时获取到焦点，导致其他应用无法获取鼠标的焦点，无法进行其他操作，整个系统处于无法操作的情况。 关于问题的出现目前是在windows下，不确定是Electron的问题，还是系统的问题，但是出现评率很高，几乎试用的同时都出现过长时间挂起，程序未响应的问题。而我本机
electron-build+vue+puppeteer 开发环境Chromium无法启动的问题
wol555c的博客
05-31 1067
可见electron-build的开发环境下，puppeteer默认是在运行相对目录dist_electron中找Chromium的启动文件npm run electron:serve 启动命令不会讲node_modules/puppeteer/.local-chromium目录复制到dist_electron下。由于没有设置executablePath指定可以启动的浏览器，打印默认的Chromuim的位置。提示的问题是找不到可以启动的浏览器程序。
Electron项目中通过electron-vue + electron-builder + electron-updater实现远程更新（包含源码）
04-01
本项目利用`electron-vue`、`electron-builder`和`electron-updater`这三款强大的工具，实现了一个完整的远程更新流程，包括检查更新、下载更新以及自动安装更新。以下将详细介绍这三个组件的功能和实现方式。 **1....
electron-vue-template:electron vue 模板
05-08
一、项目运行 1. 依赖安装 yarn install # 或者 npm install 2. 开发模式 yarn electron:serve # 或者 npm run electron:serve 3. 生产打包 yarn electron:build # 或者 npm run electron:build 4. eslint检测 yarn ...
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 项目主要有两个目的 vue@3.x 发布了...
electron-vue-serialport:electron-vue serialport 串口读取
05-24
项目参考项目运行环境1，必须安装nodejsnode下载地址-2，安装node-gypnode-gyp是用来编译c++模块的工具，这里用来编译serialport，node-gyp的github文档-全局安装 npm install -g node-gyp通过命令npm install --...
electron-vue项目示例
07-04
在 `Electron-Vue` 项目中，你可以看到 Electron 相关的依赖，如 `electron`, `vue-cli-plugin-electron-builder` 等，这些是构建和运行 Electron 应用的关键。 2. **dist_electron** - 这个目录通常包含编译后的...
使用electron-vue时遇到的问题及解决
简廉的博客
05-26 3838
目录1. 安装yarn及本地模块依赖推荐使用管理员进行安装（win10右击开始栏windows选择Windows PowerShell(管理员)）2. 创建electron-vue项目3. 运行项目时遇到的问题3.1. process is not defined在.electron-vue/webpack.renderer.config.js和.electron-vue/webpack.web.config.js文件中找到HtmlWebpackPlugin代码段并更改为如下代码：3.2. vue-devt
vue electron安装，启动遇到的坑
jenkinz的博客
04-07 2259
electron运行的时候加载vue-devtools失败 由于网络的问题，electron运行的时候加载vue-devtools失败。Unable to install `vue-devtools` 。从日志里看retry了四次都timeout了。 找了一圈，这个也没有淘宝镜像等国内镜像。不过后来按网上找了个方法，成功加载了最新的版本。 对于开发来讲，好的调试工具太重要了。 先npm install vue-devtools --save-dev 然后 把ready事件里面注释掉5行，...
electron-vue各种问题汇总
FuyuumiAI的博客
03-16 1013
目录前言1、安装2、更换electron版本3、错误提示： ReferenceError: process is not defined4、错误提示：Cannot read property 'app' of undefined5、未完待续。。。 前言 本文章记录写者使用electron-vue从安装到打包各个环境遇到的问题及解决方案，将会持续更新。 1、安装 由于electron-vue要安装electron等一些国外资源文件，所以下载巨慢、巨慢，所以这个时候就要将npm的下载源更换成国内的镜像，推荐淘宝
vue+electron项目实战总结（遇到了哪些问题，是如何解决的,哪个阶段需要做什么，附带一些常用方法）
最新发布
weixin_45062076的博客
07-08 3307
vue+electron项目实战总结（遇到了哪些问题，是如何解决的,哪个阶段需要做什么，附带一些常用方法）
electron启动报错
qq_39966730的博客
03-08 1042
但排查后都不是，最后我把main.js里面的代码也全部删除后启动，居然是一样的报错，此时认真看了下报错，看到明显是有个乱码的问题，但明明没有任何中文的东西呀；一个简单的程序启动居然报错了，那就排查原因吧，搜索网上的资料没有一个一样的，大致类似的说的是electron版本和node不一致,还有说是electron的版本问题。后面想到了公司的加密系统问题，因为公司会对改动的文件进行加密，导致了这个问题的出现，我滴乖乖，导致根本没法玩了。
银河麒麟 electron loadURL打不开，loadFile 传参
zcc的博客
08-25 2726
使用electron 开发桌面应用时：以下代码，windows 下 electron（都是10.1.3版本） 使用loadURL 可以打开，但麒麟 下loadURL 不行，白屏。在麒麟下软件左上角图标icon 要改成 png 格式，512*512 才能显示。内核：Linux 5.4.18-28.23-bj-generic。版本：银河麒麟桌面操作系统V10（SP1）架构： loongarch64。
使用Vue 插件 vue-cli-plugin-electron-builder 打包原生模板时报错解决
bangjuechun1812的博客
07-29 3573
electron-vue这个插件没用过，因为里面的electron版本和vue版本固定了感觉不灵活所以没去尝试，使用 Vuecli3.0 和electron5.0.8版本用到了串口，无语的是打包每次都成功了，一运行就报错。报错的意思大概就未引用seriaport模块，一顿无语。。。我不是在配置文件加了么。。。。 只好去他们的官网查看，终于让我找到了问题所在 蛋痛的是，这...
electron关于win10管理员权限的程序无法自启的问题
LiuQAQ的博客
09-23 1723
在64位系统下我们64位的程序访问此 HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows\CurrentVersion\Run 注册表路径，是可以正确访问的，32位程序访问此注册表路径时，默认会被系统自动映射到 HKEY_LOCAL_MACHINE\SOFTWARE\WOW6432Node\Microsoft\Windows\CurrentVersion\Run这个路径里面去。 因为32位需要管理员权限的程序通过注册表设置开机启动可以正常启动，所以我尝试将64位程序
怎么创建一个electron-vue项目
04-21
您可以按照以下步骤创建一个electron-vue项目： 1. 首先确保您安装了Node.js和npm包管理器 2. 打开终端或命令行，并输入以下命令：npm install -g vue-cli 3. 然后，输入以下命令：vue init simulatedgreg/electron-vue my-project (其中，my-project是您想要创建的项目名称) 4. 进入项目目录：cd my-project 5. 安装依赖：npm install 6. 启动项目：npm run dev 希望这能帮助您创建一个electron-vue项目！

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值