当前位置: 首页 > news >正文

如何在银河麒麟操作系统上搭建 Electron (含 Electron 打包指南)

本次教程所用版本

Eletron版本:31.3.1

Electron-packager版本:17.1.2

VScode版本:1.92.0

Node版本:18.19.0

npm版本:10.2.3

前言:

随着跨平台应用开发的需求日益增长,Electron 和 Qt 成为了两种广受欢迎的选择。Electron 以其简单易用、快速开发的特点吸引了众多前端开发者,而 Qt 则因其强大的图形界面支持和高效的性能表现受到了许多专业软件开发者的青睐。银河麒麟操作系统作为一款基于 Linux 的国产操作系统,其安全稳定的特点使得它成为了政府机构和企业用户的优选。

1. 下载VScode

官网地址:Visual Studio Code - Code Editing. Redefined

下载完成后安装即可,过程不再演示。

打开终端:

进入到/home下,并创建Eletron文件夹。用于后续的项目创建。(作者喜欢在ROOT用户下操作,更加方便快捷,但是同时也更加危险,推荐大家用普通用户就好,在mkdir 前加 sudo即可)

Vscode打开文件夹

点击Yes,获取权限。

2. 下载Node

在Vscode中打开终端,或者使用普通终端即可,这里都一样。

下载源码包:注意这里请注意架构,作者时x64,如果是arm就把x64改成arm64即可

wget https://nodejs.org/download/release/v18.19.0/node-v18.19.0-linux-x64.tar.gz

将文件解压到/usr/sbin目录下,重命名成nodejs,加上软连接即可。

tar -zxvf ./node-v18.19.0-linux-arm64.tar.gz  -C /usr/sbin  // 解压文件cd /usr/sbin/sudo mv node-v18.19.0-linux-arm64/ nodejs //相当于重命名// 软连接,方便全局使用sudo ln -s /usr/sbin/nodejs/bin/node /usr/sbin/
sudo ln -s /usr/sbin/nodejs/bin/npm /usr/sbin/

查看版本,如果正确及配置成功。

如果报错,检查一下架构错了没。

3. 安装Electron 和 Electron-packager

在换源之前我们需要先初始化一下项目,也就是生成一下JSON文件。

sudo npm init

一直敲回车即可,最后输入一个yes。Script下是个脚本,可以自己随意设置,调试的时候可以执行。

换源:

sudo npm config edit 

加上上面的即可

electron_builder_binaries_mirror=https://npmmirror.com/mirrors/electron-builder-binaries/
electron_mirror=https://cdn.npmmirror.com/binaries/electron/
registry=https://registry.npmmirror.com
strict-ssl=false

清除一下之前的缓存:

sudo npm cache clean --force

下载Electron和Electron-packager

sudo npm install --save-dev electron
sudo npm install electron-packager --save-dev

此时你会发现在JSON文件多了你的上方两个软件的版本。

这里大家也可以直接换成我的,应该没啥区别,哈哈。但是如果版本不同记得要改版本号哦。

​
{"name": "my-electron-app","version": "1.0.0","description": "Hello World!","main": "main.js","author": "Jane Doe","license": "MIT","scripts": {"start": "electron ."},"dependencies": {"electron": "^31.3.1"},"devDependencies": {"electron-packager": "^17.1.2"}
}​

这里的main.js就是我们的主程序,因为作者了解过浅,我也不知道能不能包含其他文件,这里就不瞎说了。

4. 打包程序为exe

这里大家去AI随意生成一个即可。

在Script中添加打包命令:

"package-mac": "electron-packager . Path --platform=linux --arch=x64 --electron-version=31.3.1 --mirror=https://npm.taobao.org/mirrors/electron/ --out=dist

选项详解

  • .:这表示你的项目的根目录,即包含 package.json 文件的目录。
  • Path:这是打包后应用程序的名称。
  • --platform=linux:指定目标平台为 Linux。
  • --arch=x64:指定目标架构为 64 位。
  • --electron-version=31.3.1:指定 Electron 的版本为 31.3.1。
  • --mirror=https://npm.taobao.org/mirrors/electron/:指定 Electron 的镜像源,这里使用了 Taobao 镜像,不然会超时。
  • --out=dist:指定输出目录为 dist,打包好的应用程序将被放置在这个目录下。

点击script上方的Debug

点击即可,这里需要切换的root用户。

这里会有一个dist目录,其中会有一个Path可执行程序

至此,大功告成。

相关文章:

如何在银河麒麟操作系统上搭建 Electron (含 Electron 打包指南)

本次教程所用版本 Eletron版本:31.3.1 Electron-packager版本:17.1.2 VScode版本:1.92.0 Node版本:18.19.0 npm版本:10.2.3 前言: 随着跨平台应用开发的需求日益增长,Electron 和 Qt 成为…...

小怡分享之数据结构基础知识准备

前言: 🌈✨之前小怡给大家分享了JavaSE的知识,今天小怡要给大家分享一下数据结构基础知识。 一、初识集合框架 1.什么是集合框架 Java集合框架Java Collection Framework, 又称为容器container,是定义在Java.util 包…...

Linux安全与高级应用(三)深入探索MySQL数据库:安装、管理与安全实践

文章目录 深入探索MySQL数据库:安装、管理与安全实践MySQL数据库简介MySQL的安装与配置编译安装MySQL配置MySQL服务 MySQL数据库的基本操作数据库的创建与删除表的创建与管理数据记录的增删改查 MySQL用户管理与权限设置MySQL数据库的备份与恢复数据库备份数据库恢复…...

基于jsp的宠物领养与服务管理系统(源码+论文+部署讲解等)

博主介绍:✌全网粉丝10W,csdn特邀作者、博客专家、CSDN新星计划导师、Java领域优质创作者,博客之星、掘金/华为云/阿里云/InfoQ等平台优质作者、专注于Java技术领域和学生毕业项目实战,高校老师/讲师/同行前辈交流✌ 技术栈介绍:我是程序员阿龙&#xff…...

基于STM32F407+NBIOT+华为云IOT平台设计的环境检测系统

基于STM32F407NBIOT华为云IOT平台设计的环境检测系统实现的功能: 【1】能够采集本地环境的温度、湿度、烟雾浓度,火光信息,在OLED显示屏上显示。 如果检测到烟雾、温度、火光超过阀值会触发蜂鸣器报警。 【2】能够通过NBIOT将本地设备采集的信…...

工具方法 - 如何表扬小孩子

赞扬小朋友的表现可以通过多种方法来进行,以鼓励他们的积极行为和努力,增强他们的自信心和动力。以下是一些有效的赞扬方法: 1. 具体表扬:指出具体的行为或成就,而不是泛泛地说“你很棒”。例如,“你今天很…...

【扒模块】DySample

逐行注释 import torch import torch.nn as nn import torch.nn.functional as F import warnings# 忽略警告信息,这通常用于开发过程中,避免警告干扰输出结果 warnings.filterwarnings(ignore)# 定义一个函数,用于对神经网络模块的权重进行…...

数学建模之数据分析【四】:变量及其分析

文章目录 一、单变量数据1.1 单变量数据1.2 单变量分析的要点: 二、双变量数据2.1 双变量数据2.2 双变量分析的要点 三、多元数据3.1 多元数据3.2 多元分析的要点 四、单变量,双变量和多变量数据之间的区别 公众号/小红书: 快乐数模 CSDN: 清上尘 本文&a…...

iOS ------ UIKit相关

UIView和CALayer UIView UIView表示屏幕上的一块矩形区域,它是基本上iOS中所有可视化控件的父类。UIView可以管理矩形区域里的内容,处理矩形区域的事件,包括子视图的管理以及动画的实现。 UIKit相关类的继承关系 UIView继承自UIResponde…...

24/8/9算法笔记 随机森林

"极限森林"(Extremely Randomized Trees,简称ERT)是一种集成学习方法,它属于决策树的变体,通常被归类为随机森林(Random Forest)的一种。极限森林的核心思想是在构建决策树时引入极端…...

如何在前后端分离项目中,使用Spring Security

使用 WebSecurityConfigurationAdapter 在前后端分离的架构中,通常使用 Token 进行认证和授权是一种常见的做法。Token 可以是 JSON Web Token(JWT),用于在客户端和服务器之间传递身份信息和访问控制信息。下面我将详细介绍如何在…...

c#怎么折叠代码快捷

在C#中,‌你可以使用快捷键来折叠或展开代码,‌以便更好地管理和浏览代码。‌以下是一些常用的快捷键:‌ 折叠所有方法:‌使用Ctrl M O。‌折叠或展开当前方法:‌使用Ctrl M M。‌展开所有方法:‌使用…...

数据库篇--八股文学习第十七天| 什么是慢查询?原因是什么?可以怎么优化?;undo log、redo log、binlog 有什么用?

1、什么是慢查询?原因是什么?可以怎么优化? 答: 数据库查询的执行时间超过指定的超时时间时,就被称为慢查询。 原因: 查询语句比较复杂:查询涉及多个表,包含复杂的连接和子查询&…...

插件、cookie存储,json,ajax详解

1.插件 下载地址:http://github.com/carhartl/jquery-cookie/zipball/v1.4.1 使用文档:jquery-cookie(github.com) 2.存储 初学前端用的是localStorage和sessionStorage,后来又引入了cookie进行存储。 localStorage使用如下 sessionStor…...

快速上手Spring Boot

快速上手Spring Boot (qq.com)...

思路超清晰的 LVS-NAT 模式实验部署

目录 一、实验原理 1、实验基础配置图 2、实验原理 二、实验环境准备 1、准备四台红帽9的主机 2、四台主机的基础配置 (1)client 1)配置主机名:client 2)配置ip:172.25.254.200 (2)lv…...

Android实时通信:WebSocket与WebRTC的应用与优化

文章目录 一、WebSocket在Android中的应用1.1 简介1.2 示例 二、WebRTC在Android中的应用2.1 简介2.2 示例 三、Android实时通信的优化策略3.1 网络优化3.2 延迟降低 四、Android实时通信的安全问题五、实时通信协议的比较六、总结 在现代移动应用中,实时通信已经成…...

力扣刷题之3131.找出与数组相加的整数I

题干描述 给你两个长度相等的数组 nums1 和 nums2。 数组 nums1 中的每个元素都与变量 x 所表示的整数相加。如果 x 为负数,则表现为元素值的减少。 在与 x 相加后,nums1 和 nums2 相等 。当两个数组中包含相同的整数,并且这些整数出现的频…...

非线性表之堆的实际应用和二叉树的遍历

目录 前言:前一篇我已经介绍过了二叉树和堆的介绍和相关代码的实现 一、堆的实现 1.1堆向上调整算法 1.2堆向下调整算法 二、堆的应用 2.1堆的排序 2.2TOP-K问题 三、二叉树的遍历 3.1 二叉树的创建 3.2遍历介绍 3.3前序遍历 3.4中序遍历 3.5后序遍历 …...

os.path库学习之splitext函数

os.path库学习之splitext函数 一、简介 os.path.splitext 是 Python 标准库 os.path 模块中的一个函数,用于将文件名分割成两部分:文件名和扩展名。这个函数非常有用,特别是在处理文件路径和文件扩展名时。 二、语法和参数 语法: os.path…...

ESP32 I2S音频总线学习笔记(四): INMP441采集音频并实时播放

简介 前面两期文章我们介绍了I2S的读取和写入,一个是通过INMP441麦克风模块采集音频,一个是通过PCM5102A模块播放音频,那如果我们将两者结合起来,将麦克风采集到的音频通过PCM5102A播放,是不是就可以做一个扩音器了呢…...

【android bluetooth 框架分析 04】【bt-framework 层详解 1】【BluetoothProperties介绍】

1. BluetoothProperties介绍 libsysprop/srcs/android/sysprop/BluetoothProperties.sysprop BluetoothProperties.sysprop 是 Android AOSP 中的一种 系统属性定义文件(System Property Definition File),用于声明和管理 Bluetooth 模块相…...

相机从app启动流程

一、流程框架图 二、具体流程分析 1、得到cameralist和对应的静态信息 目录如下: 重点代码分析: 启动相机前,先要通过getCameraIdList获取camera的个数以及id,然后可以通过getCameraCharacteristics获取对应id camera的capabilities(静态信息)进行一些openCamera前的…...

基于Docker Compose部署Java微服务项目

一. 创建根项目 根项目&#xff08;父项目&#xff09;主要用于依赖管理 一些需要注意的点&#xff1a; 打包方式需要为 pom<modules>里需要注册子模块不要引入maven的打包插件&#xff0c;否则打包时会出问题 <?xml version"1.0" encoding"UTF-8…...

【论文阅读28】-CNN-BiLSTM-Attention-(2024)

本文把滑坡位移序列拆开、筛优质因子&#xff0c;再用 CNN-BiLSTM-Attention 来动态预测每个子序列&#xff0c;最后重构出总位移&#xff0c;预测效果超越传统模型。 文章目录 1 引言2 方法2.1 位移时间序列加性模型2.2 变分模态分解 (VMD) 具体步骤2.3.1 样本熵&#xff08;S…...

【JavaWeb】Docker项目部署

引言 之前学习了Linux操作系统的常见命令&#xff0c;在Linux上安装软件&#xff0c;以及如何在Linux上部署一个单体项目&#xff0c;大多数同学都会有相同的感受&#xff0c;那就是麻烦。 核心体现在三点&#xff1a; 命令太多了&#xff0c;记不住 软件安装包名字复杂&…...

vue3+vite项目中使用.env文件环境变量方法

vue3vite项目中使用.env文件环境变量方法 .env文件作用命名规则常用的配置项示例使用方法注意事项在vite.config.js文件中读取环境变量方法 .env文件作用 .env 文件用于定义环境变量&#xff0c;这些变量可以在项目中通过 import.meta.env 进行访问。Vite 会自动加载这些环境变…...

保姆级教程:在无网络无显卡的Windows电脑的vscode本地部署deepseek

文章目录 1 前言2 部署流程2.1 准备工作2.2 Ollama2.2.1 使用有网络的电脑下载Ollama2.2.2 安装Ollama&#xff08;有网络的电脑&#xff09;2.2.3 安装Ollama&#xff08;无网络的电脑&#xff09;2.2.4 安装验证2.2.5 修改大模型安装位置2.2.6 下载Deepseek模型 2.3 将deepse…...

无人机侦测与反制技术的进展与应用

国家电网无人机侦测与反制技术的进展与应用 引言 随着无人机&#xff08;无人驾驶飞行器&#xff0c;UAV&#xff09;技术的快速发展&#xff0c;其在商业、娱乐和军事领域的广泛应用带来了新的安全挑战。特别是对于关键基础设施如电力系统&#xff0c;无人机的“黑飞”&…...

力扣热题100 k个一组反转链表题解

题目: 代码: func reverseKGroup(head *ListNode, k int) *ListNode {cur : headfor i : 0; i < k; i {if cur nil {return head}cur cur.Next}newHead : reverse(head, cur)head.Next reverseKGroup(cur, k)return newHead }func reverse(start, end *ListNode) *ListN…...