vue cli3 中快速集成 electron13+

最新推荐文章于 2024-06-12 22:10:45 发布
最新推荐文章于 2024-06-12 22:10:45 发布
阅读量348 收藏
点赞数
分类专栏： Element使用心得 项目经验
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/coder5266/article/details/117933270
版权

1.首先在vue项目中下载electron 依赖 

npm install --save-dev electron

2.修改package.js中的配置项目

（1）增加main：“main.js”

（2）增加调试脚本

3.根目录新建main.js文件 同时添加electron中mian.js对应的内容，修改加载文件的目录

 

朱元皓5057
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue-cli3+Electron
hunter_97的博客
04-22 3694
注意：我这里使用的是vuecli3。之前的版本可以参考electron-vue 起步。 一、 创建项目 创建vue项目。 参考我之前的文章vue 之 vue-cli3，创建项目。这里我创建的项目是electron-vue-test。 安装electron,自动安装和手动安装任选其一。 2.1 自动安装，进入到项目根目录，执行：vue add electron-builder，然后选择elec...
vue2+elementui+electron项目配置
06-06
接下来，为了集成Electron，你需要安装`electron`和`electron-builder`。`electron-builder`用于构建和打包应用程序。在项目中执行以下命令： ```bash npm install electron --save-dev npm install electron-...
vite+ vue3项目添加electron，并electron打包教程，以及electron代码热重载页面
L_15737525552的博客
07-23 4646
4.其中的env是阀门方便打包成app，开发中热更新就使用env=pro就好了，因为监听的是8888端口，所以我们需要去更改vue的运行端口，在根目录vite.config.js中加入以下代码。现在启动程序npm run electrone:dev会得到一片空白，展示如下页面，因为现在监听的是vue打包后的dist文件夹中的index.html。只在开发环境中使用，并且不会在生产环境中被打包到应用程序中。应该只在开发环境中使用，而不是在生产环境中使用。3.在package.json中新增打包命令。
vue3集成electron
I_xuebi的博客
05-17 6350
vue3 vue 集成 electron 白屏 打包
vue3+electron搭建桌面软件
最新发布
Leo_DLi的博客
06-12 1119
最近有个小项目, 客户希望像打开 网易云音乐 那么简单的运行起来系统. 前端用 Vue 会比较快一些, 因此决定使用 electron 结合 Vue3 的方式来完成该项目.然而, 在实施过程中发现没有完整的博客能够记录从创建到打包的流程, 摸索一番之后, 随即梳理成文供大家参考.废话不多说, 直接开始!对了, 开始之前, 先给 Vue3 和 electron 在 package.json 中的版本号展示出来供大家参考.
Electron和vue3集成（推荐仅用于开发）
无效的博客
09-09 959
本篇我们仅实现Electron和vue3通过先运行起vue3项目，再将vue3的url地址交由Electron打开的方案，仅由Electron在vue3项目上套一层壳来达到脱离本机浏览器运行目的。9、为了使vue和electron正常运行，需要先运行vue，使得其url可以正常访问，然后再开启electron去加载url。5、拷贝vue3项目根目录下除了package.json外的所有文件到Electron项目根目录下。8、修改Electron的main.js，运行的时候载入vue的访问地址。
Vue3项目整合Electron
学习和工作总结，共勉！
08-31 6867
Vue3项目整合Electron 第一步安装：VUE3 安装vue3脚手架 npm install -g @vue/cli 安装 yarn，并设置淘宝源 npm install -g cnpm --registry=https://registry.npm.taobao.org 设置ELECTRON_MIRROR,加速electron的预编译 npm config set ELECTRON_M...
Electron + Vue3 开发桌面应用
热门推荐
Hyung的博客
01-04 2万+
Electron + Vue3 开发桌面应用
Electron项目中通过electron-vue + electron-builder + electron-updater实现远程更新（包含源码）
04-01
3. **集成electron-updater**：在主进程（main process）中引入`electron-updater`，并监听更新事件。 4. **检测更新**：在应用启动时调用`autoUpdater.checkForUpdates()`来检查是否有可用的更新。 5. **下载更新**...
使用electron+vue集成跨平台桌面应用程序
03-17
总的来说，`electron+vue`的组合为开发者提供了一种高效且灵活的方式，利用Web技术构建原生桌面应用。通过理解这两个工具的核心概念和它们的集成方式，开发者可以快速地构建出功能丰富的跨平台应用，满足各种业务...
electron vue/cli 文件
02-23
`Electron Vue CLI` 是 `Electron` 和 `Vue.js` 的集成工具，它使用 `Vue CLI`（Vue 的命令行工具）作为基础，添加了对 `Electron` 开发的支持。通过 `Electron Vue CLI`，开发者可以快速初始化一个包含 `Vue.js` 和...
手动整合electron和vue
09-02
手动整合electron和vue，博客地址：https://blog.csdn.net/qq_40488121/article/details/108360862
vue-admin-element+Electron打包exe可执行文件(输出为dist文件夹即可)
04-24
在提供的压缩包子文件"electron-quick-start-main"中，可能是Electron的快速启动模板的主进程代码，可能包含了初始化Electron应用、加载Vue应用页面等内容，是打包过程中的关键部分。这个模板可以作为构建项目的基础...
vue3+electron开发桌面软件入门与实战（2）——创建electron+vue3框架打包集成
关注前端，关注原创
10-13 5591
electron+vue3+vite+electron-builder项目级打包方案，vite配置讲解，vue打包编译讲解，package.json配置讲解
Electron 4 开发跨平台桌面应用
koukou的博客
11-07 630
Electron是一个基于Chromium和 Node.js，可以使用 HTML、CSS和JavaScript构建跨平台应用的技术框架，兼容 Mac、Windows 和 Linux。虽然B/S是目前开发的主流，但是C/S仍然有很大的市场需求。受限于浏览器的沙盒限制，网页应用无法满足某些场景下的使用需求，而桌面应用可以读写本地文件、调用更多系统资源，再加上Web开发的低成本、高效率的优势，这种方式越来越受到开发者的喜爱。 本文一步一步教你如何使用Electron5和vue-cli3，在完全保留vue开发web
vite2+vue3+electron13创建桌面应用
SUN-天旭
05-10 792
1、生成vite2+Vue3框架 npm init @vitejs/app vite-vue-win cd vite-vue-win npm install npm run dev 2、为vue引入electron框架 在项目根目录创建 .npmrc文件，并添加如下内容 electron_mirror=http://cdn.npm.taobao.org/dist/electron/ 3、安装所需的启动及打包模块 npm install electron --save-dev npm i
向vue中集成electron（使用electron-builder插件直接将electron集成到自己的项目）
qq_45787691的博客
09-01 5302
使用 vue add electron-builder将electron直接集成到vue项目中。
vue3+electron开发桌面软件0基础入门，搭建全网最简单的项目！
Taweiyue的博客
06-08 2284
3.1在跟目录下创建 electron文件夹，electron文件夹下创建主进程文件 main.js3.2然后在package.json配置入口，并删掉 "type": "module"
Electron学习记录（二）-在Electron中使用vue3
sinat_37066308的博客
04-23 3436
本质就是用vue写前端页面，然后用Electron套壳，通过window传递消息，实现前端和node之间的通信。
java开发桌面应用_Electron7+VueCli4开发跨平台桌面应用
05-26
安装Node.js和npm可以让你在本地开发环境中运行和管理Electron和VueCli。 2. 安装Electron 在安装Electron之前，需要先创建一个空目录作为项目根目录，然后在命令行中切换到该目录下，执行以下命令： ``` npm ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值