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

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

ruisui884个月前 (03-01)技术分析15

一.先创建一个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创建桌面端应用和打包发布” 的相关文章

企业如何高效进行费控管理?

作为一个职场人,无论是普通员工、财务人员还是企业管理人,都无法避开报销,而报销,就涉及到了企业成本费用控制,即费控。其控制的内容包括材料消耗成本控制、工资成本控制、费用成本控制。但在实际工作中,员工不知道如何规范化提交报销申请,报销容易频频被打回,导致报销周期长;财务人员也面临着报表滞后、账实不符、...

管理费用预算管理办法

第一章 总则第一条 为实现公司各项经营指标,控制费用开支,规范管理费用预算,特制定本办法。第二条 本办法适用于公司内各部门的管理费用预算工作。第三条 职责划分(一)各职能部门,负责提出部门预算目标及确定依据,编制部门预算,并执行预算方案。(二)财务部门,负责汇总、审查、分析、平衡各部门预算,提出调整...

gitlab简单搭建与应用

一、gitlab1、简介GitLab是利用Ruby on Rails一个开源的版本管理系统,实现一个自托管的Git项目仓库,可通过Web界面进行访问公开的或者私人项目。与Github类似,GitLab能够浏览源代码,管理缺陷和注释。可以管理团队对仓库的访问,它非常易于浏览提交过的版本并提供一个文件历...

理解virt、res、shr之间的关系(linux系统篇)

前言想必在linux上写过程序的同学都有分析进程占用多少内存的经历,或者被问到这样的问题——你的程序在运行时占用了多少内存(物理内存)?通常我们可以通过top命令查看进程占用了多少内存。这里我们可以看到VIRT、RES和SHR三个重要的指标,他们分别代表什么意思呢?这是本文需要跟大家一起探讨的问题。...

Python 幕后:Python导入import的工作原理

更多互联网精彩资讯、工作效率提升关注【飞鱼在浪屿】(日更新)Python 最容易被误解的方面其中之一是import。Python 导入系统不仅看起来很复杂。因此,即使文档非常好,它也不能让您全面了解正在发生的事情。唯一方法是研究 Python 执行 import 语句时幕后发生的事情。注意:在这篇文...

一文让你彻底搞懂 vue-Router

路由是网络工程里面的专业术语,就是通过互联把信息从源地址传输到目的地址的活动。本质上就是一种对应关系。分为前端路由和后端路由。后端路由:URL 的请求地址与服务器上的资源对应,根据不同的请求地址返回不同的资源。前端路由:在单页面应用中,根据用户触发的事件,改变URL在不刷新页面的前提下,改变显示内容...