国产麒麟系统下打包electron+vue项目(AppImage、deb)

需要用到的一些依赖包、安装包以及更详细的打包方法word以及麒麟官网给出的文档都已放网盘,链接在文章最后!!!!!!!!!!!!!!!!!!

搭建开发环境可参考之前文章:银河麒麟v10安装前端环境(Node、vue、Electron+vite)_麒麟系统安装nodejs-CSDN博客

一.将项目打包成两种格式的包

第一种Appimage包(这种包比较简单没太多环境配置),下面是对此包的解释

1.相关代码配置:

在package.json中打包相关配置,icon必须设置否则打包会报错

  "build": {"appId": "com.electron.desktop","productName": "xxx","asar": false,"copyright": "Copyright © 2022 electron","directories": {"output": "release/"},"files": ["dist"],"linux": {"icon": "xxx","category": "System","target": [{"target": "AppImage","arch": ["arm64"]}]},"nsis": {"oneClick": false,"perMachine": false,"allowToChangeInstallationDirectory": true,"deleteAppDataOnUninstall": false},"publish": [{"provider": "generic","url": "http://127.0.0.1:8080"}],"releaseInfo": {"releaseNotes": "版本更新的具体内容"}},

此外还必须添加author字段和homepage字段,否则打包必报错

 "author": {"name": "xxxx","email": "xxx"},"homepage": "xxx"

2.执行打包命令,有网情况下系统会自动下载工具包进行打包,也会将自动安装electron到全局,如果下载失败可手动创建文件并将压缩包放在里面,网盘里面自行下载。

此文件路径在系统根目录中的..cache/electron-builder下,因为此包是在github上下载可能会遇到下载失败情况,可在我个人网盘下载此包,手动创建electron-builder文件将包放进去即可,文件路径必须按照.cache/electron-builder

执行打包命令就可完成打包,执行程序为后缀名为AppImage的文件,双击直接运行也可在终端使用命令打开./xxxx.AppImage;

3.遇到问题及解决方法

如果双击程序没反应,程序并没有打开需要检查是否给了权限,右键图标属性=》权限=》勾选可执行,在运行程序即可.

要是还是不行在看看设置=>安装中心=》应用保护,看下是否是因为被系统阻止打开了

以上方法还是不行的话可能就是因为系统版本库中缺少啥东西,经网上查阅找到了解决方法,其原理不太明白,至少解决打不开的问题。在终端用命令启动程序后面加上个--no-sandbox。

./xxx.AppImage --no-sandbox

二、打包成格式为deb的一键安装包

打此种包有点复杂,步骤按照以下来,缺少一步都不行

1.第一步依旧是配置代码,具体代码上面也有,唯一变的就是将AppImage替换为deb

 "linux": {    // linux系统"icon": "./public/icon.png","category": "income","target": [{"target": "deb"//AppImage}]},

2.环境配置(安装fpm打包工具)

使用electron-builder打包时需要用到fpm包,但fpm包npm仓库源仅有x86_64架构的包,下不了arm架构的,打包时会有报错,必须使用arm架构的包。

我们可以从系统源中安装ruby,然后使用gem install fpm来安装fpm,然后设置全局变量,使用系统fpm具体操作方法如下:

1.sudo apt update

2.sudo apt innstall ruby -y

安装了ruby可查看版本 有版本号就成功了,下载会很慢,多等等....

4.sudo gem install fpm

麒麟v10系统使用gem安装fpm可能会有如下报错,这是由于v10系统中ruby版本低导致的,这里需要用到我在其他地方拉下来的包。

网盘将包下载来后解压使用sudo depkg -i*deb安装相关库,然后再重新进行上面的操作

5.将"export USE_SYSTEM_FPM="true""配置到环境变量

        sudo vim /etc/profile   打 开配置文件

        键盘shift+i     打开编辑模式,然后添加export USE_SYSTEM_FPM="true

        键盘Esc    退出编辑

         键盘:wq           保存文件,退出vim

        source/etc/profile   使环境变量生效

6.单独使用个文件来写打包配置代码,我这里在项目中添加了个electron.config.json

const { defineConfig } = require('@vue/cli-service')
const path = require('path')
module.exports = defineConfig({transpileDependencies: true,pluginOptions: {electronBuilder: {builderOptions: {"appId": "com.swpe.analysis","productName": "123",//项目名,也是生成的安装文件名,即aDemo.exe"copyright": "Copyright © 2020",//版权信息"asar": false,"directories": {"output": "./dist"//输出文件路径},"linux": {"target": "deb",  // AppImage deb// "target": [//     {//         "target": "deb",//         "arch": ["armv7l", "arm64"]//     }// ], // arm64框架"icon": "public/icon/abc.png","category": "Development","desktop": {Icon: "/home/tn140/桌面/code/test-package/test2/public/icon/abc.png"}},// "linux": {//   "icon": "public/icon",//   "category": "Utility",//   "target": [//     {//       "target": "AppImage"//     }//   ]// },}}}
})

第一次打包的话环境不稳定因素太多,可能fpm的问题会报一些稀奇古怪的错,第一次打包可按照这个方法操作,成功过后说明环境有效就可进行正常流程打包

7.在package.json中添加打包指令(e:arm)

  "scripts": {"serve": "vue-cli-service serve","build": "vue-cli-service build","e:arm": "USE_SYSTEM_FPM=true electron-builder --config electron.config.json -l --arm64","e:build": "vue-cli-service electron:build","e:serve": "vue-cli-service electron:serve","postinstall": "electron-builder install-app-deps","postuninstall": "electron-builder install-app-deps"},

输入打包命令e:arm即可完成打包

Node包、nvm包、vscode(arm版)、ruby包、麒麟官网的electron开发指导.pdf

百度云盘:https://pan.baidu.com/s/1cYB0HzoMo5iCcpKvq0LUkQ

提取码:swpe

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/3858.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

备考数通HCIE证书4点经验分享!

大家好,我是来自安阳工学院20级网络工程的刁同学,在2023年12月20日成功通过了华为Datacom HCIE认证,并且取得了笔试900多分,实验B的成绩。在此,我想把我的一些考证心得分享给正在备考的小伙伴们。 关于为什么考证 我…

使用自定义注解处理器,自动收集类信息

背景 在开发过程有些时候我们会需要收集一些类信息。比如要知道某个子类下的所有实现类。可以通过反射的方式实现。但是这种方法有性能问题,因为在运行时,所有类都会包含在dex文件中。这个文件中的类可能有几十万个。而且在实际开发中会发现&#xff0c…

ArcGIS专题图制作—3D峡谷地形

6分钟教你在ArcGIS Pro中优雅完成炫酷的美国大峡谷3D地图 6分钟教你在ArcGIS Pro中优雅完成炫酷的美国大峡谷3D地图。 这一期的制图教程将带我们走入美国大峡谷,让我们一起绘制这张美妙的地图吧!视频也上传到了B站,小伙伴可以去! …

数据结构与算法解题-20240426

这里写目录标题 面试题 08.04. 幂集367. 有效的完全平方数192. 统计词频747. 至少是其他数字两倍的最大数718. 最长重复子数组 面试题 08.04. 幂集 中等 幂集。编写一种方法,返回某集合的所有子集。集合中不包含重复的元素。 说明:解集不能包含重复的子…

【网络原理】TCP协议的连接管理机制(三次握手和四次挥手)

系列文章目录 【网络通信基础】网络中的常见基本概念 【网络编程】网络编程中的基本概念及Java实现UDP、TCP客户端服务器程序(万字博文) 【网络原理】UDP协议的报文结构 及 校验和字段的错误检测机制(CRC算法、MD5算法) 【网络…

Swift - 流程控制

文章目录 Swift - 流程控制if-else2. while3. for3.1 闭区间运算符3.2 半开区间运算符3.3 for - 区间运算符用在数组上3.3.1 单侧区间 3.4 区间类型3.5 带间隔的区间值 4. switch4.1 fallthrough4.2 switch注意点 5. 复合条件6. 区间匹配、元组匹配7. 值绑定8. where9. 标签语句…

DRF JWT认证进阶

JWT认证进阶 【0】准备工作 (1)模型准备 模型准备(继承django的auth_user表) from django.db import models from django.contrib.auth.models import AbstractUserclass UserInfo(AbstractUser):mobile models.CharField(ma…

C语言——内存函数的实现与模拟

1. memcpy 函数 与strcpy 函数类似 1.头文件 <string.h> 2.基本格式 • 函数memcpy从source的位置开始向后复制num个 字节 的数据到destination指向的内存位置。 • 这个函数在遇到 \0 的时候并不会停下来。 • 如果source和destination有任何的重叠&#xff0…

2024年钉钉直播回放怎么下载

又到了2024年,最近钉钉迎来了一波更新,经过我的研究,总算研究出来了一个方法,并且做成了工具 首先&#xff0c;让我们了解一下钉钉直播回放的下载方法。 钉钉直播回放工具链接&#xff1a;https://pan.baidu.com/s/1oPWJOp8L2SBDlklt_t5WQQ?pwd1234 提取码&#xff1a;1234 -…

【快速上手ESP32(基于ESP-IDFVSCode)】10-事件循环WiFi

事件循环 本来这篇文章是只写WiFi的&#xff0c;但是写的时候才发现离不开事件循环&#xff0c;因此再多添一点内容在WiFi前面。 事件循环简单来说就是一个&#xff08;循&#xff09;环&#xff0c;我们可以在这个环上绑上一些事件&#xff0c;我们也可以监听这个环&#xf…

JavaScript进阶(十五):JS 垃圾回收机制_vue gc

内存&#xff1a;由可读写单元组成&#xff0c;表示一片可操作空间&#xff1b;管理&#xff1a;人为的去操作一片空间的申请、使用和释放&#xff1b;内存管理&#xff1a;开发者主动申请空间、使用空间、释放空间&#xff1b;管理流程&#xff1a;申请-使用-释放&#xff1b;…

oracle sql monitor简单使用说明

一 sql monitor介绍 二 用命令行方式生成sql monitor报告 set long 1000000 set longchunksize 100000 set linesize 1000 set pagesize 0 set trim on set trimspool on set echo off set feedback off spool report_sql_monitor.html select dbms_sqltune.report_s…

线性代数-行列式-p1 矩阵的秩

目录 1.定义 2. 计算矩阵的秩 3. 矩阵的秩性质 1.定义 2. 计算矩阵的秩 3. 矩阵的秩性质

美国言语听力学会(ASHA)关于非处方 (OTC) 助听器的媒体声明(翻译稿)

美国国会于 2021 年 4 月 13 日批准美国听力学会积极提供建议&#xff0c;并一直积极参与制定FDA关于非处方助听器销售的拟议法规。根据2017年通过的立法授权。学院积极参与帮助塑造授权立法&#xff0c;并就即将出台的条例分享了建议。 根据美国卫生与公众服务部NIH / NIDCD的…

用Python绘制了几张有趣的可视化图表

流程图存在于我们生活的方方面面&#xff0c;对于我们追踪项目的进展&#xff0c;做出各种事情的决策都有着巨大的帮助&#xff0c;而对于的Python而言呢&#xff0c;绘制流程图也是十分轻松的&#xff0c;今天小编就来为大家介绍两个用于绘制流程图的模块&#xff0c;我们先来…

12 JavaScript学习: 字符串

JavaScript 字符串 JavaScript 字符串是一种用于存储和操作文本数据的数据类型。字符串可以包含字母、数字、符号和空格等字符。在 JavaScript 中&#xff0c;字符串可以使用单引号&#xff08;&#xff09;或双引号&#xff08;"&#xff09;来定义。 例如&#xff1a;…

链表与模拟LinkedList的实现

1. ArrayList的缺陷 ArrayList底层使用数组来存储元素 由于其底层是一段连续空间&#xff0c;当在ArrayList任意位置插入或者删除元素时&#xff0c;就需要将后序元素整体往前或者往后 搬移&#xff0c;时间复杂度为O(n)&#xff0c;效率比较低。因此ArrayList不适合做任意位…

机械臂过程

rosdep install --from-paths src --ignore-src --rosdistro melodic0、安装机械手臂 官方教程&#xff1a; 前人教程&#xff1a;UR5机械臂仿真实例 rosdep update 出错&#xff0c;使用小鱼的大佬的 一键配置 wget http://fishros.com/install -O fishros && . fish…

Rest微服务案例

Rest 父工程构建microservicecloud-api公共子模块Modulemicroservicecloud-provider-dept-8001部门微服务提供者Modulemicroservicecloud-consumer-dept-80部门微服务消费者Module 以Dept部门模块做一个微服务通用案例 Consumer消费者&#xff08;Client&#xff09;通过REST调…

ssm082基于java斗车交易系统设计与实现+vue

斗车交易系统 摘 要 21世纪的今天&#xff0c;随着社会的不断发展与进步&#xff0c;人们对于信息科学化的认识&#xff0c;已由低层次向高层次发展&#xff0c;由原来的感性认识向理性认识提高&#xff0c;管理工作的重要性已逐渐被人们所认识&#xff0c;科学化的管理&…