当前位置:首页 > 技术分析 > 正文内容

vue+electron创建桌面端应用和打包发布

ruisui882个月前 (03-01)技术分析10

一.先创建一个vue项目:

1.创建vue项目:

vue create myelectronapp

2.选择Vue 3:


3.安装完成:


4.进入项目的根目录:

cd myelectronapp

5.运行vue项目:

yarn serve

6.成功启动vue项目:

二.安装election包

vue脚手架3.0的插件
vue-cli-plugin-electron-builder 帮助vue脚手架直接引入Electron的依赖,并生成相关文件和配置

1.安装并调用
vue-cli-plugin-electron-builder的生成器:

vue add electron-builder

2.选择最新的electron版本:


3.安装完成:


4.在项目的根目录下运行启动命令:

yarn electron:serve
或者
npm run electron:serve

5.成功启动桌面应用:


6.构建打包命令:

yarn electron:build
或者
npm run yarn electron:build

7.构建完成:

8.可以看到构建输出目录生成对应的xxx.exe文件,这个就是桌面应用的安装包,点击可以安装桌面应用。


备注:
electron官方地址:

https://www.electronjs.org

electron文档地址:
https://github.com/electron/electron/tree/master/docs

electron接口文档
api:https://www.electronjs.org/docs/api

扫描二维码推送至手机访问。

版权声明:本文由ruisui88发布,如需转载请注明出处。

本文链接:http://www.ruisui88.com/post/2366.html

分享给朋友:

“vue+electron创建桌面端应用和打包发布” 的相关文章

“韩版谷歌”Naver进军操作系统,发布自研免费Linux发行版

IT之家 12 月 11 日消息,有“韩版 Google”之称的 Naver 公司正式进军操作系统领域,发布了自主研发的 Linux 发行版 Navix,为企业提供了一个稳定、可靠且免费的 Linux 发行版选择。IT之家援引科技媒体 theregister 观点,此举效仿了谷歌的多元化发展战略,也...

79.idea中git合并分支操作分享

文章目录前言1.fetch的操作2.合并最新代码到当前的开发分支3.解决冲突4.分支合并:5.完成代码合并总结前言git的操作在日产的工作中也非常重要,团队化的代码管理,每次如果代码被别人覆盖或者自己的代码不能提交到服务器那是灾难性的结果,本篇进行一篇分享来总结下idea中git的操作帮助java开...

Solid State Logic 发布低保真数字失真插件 Digicrush

Solid State Logic 宣布推出低保真数字失真插件 Digicrush ,他们最新的创意工具具有经典数字失真的粗糙、低保真特性,完美模拟早期数字音频的衰减和伪影。Digicrush 充满怀旧气息,深受经典数字采样器和效果器的影响,具有内置抖动、可调比特深度和采样率降低功能,是为音轨添加复...

最快清除数组空值?分享 1 段优质 JS 代码片段!

本内容首发于工粽号:程序员大澈,每日分享一段优质代码片段,欢迎关注和投稿!大家好,我是大澈!本文约 600+ 字,整篇阅读约需 1 分钟。今天分享一段优质 JS 代码片段,用最简洁的代码清除了数组中的空值。老规矩,先阅读代码片段并思考,再看代码解析再思考,最后评论区留下你的见解!const arr...

Excel中的FILTER函数详细介绍及使用示例

在Excel中处理大量数据时,经常需要根据特定条件筛选出符合条件的数据行或列。这正是Excel的FILTER函数发挥作用的地方。FILTER函数是Excel中一个非常强大的工具,它可以基于一个或多个条件动态地过滤数据,使数据分析和报告制作变得更加高效和准确。本文将详细介绍FILTER函数的用法,并提...

分享15个基于Vue3.0全家桶的优秀开源项目

大家好,我是 Echa。今天来分享 15 个基于 Vue3.0 全家桶的优秀开源项目!1. Vue Admin Bettergithub : https://github.com/chuzhixin/vue-admin-bettervue admin better 对比其他来源 admin 框架有如...