开发electron最大的特点就是可以使用web技术来开发跨平台应用,大部分开发都是在windows/mac上开发的electron应用,我使用的是
electorn-builder
来构建应用,官网提供支持在windows上使用docker来实现Linux版本的构建。可以直接在Linux服务器上完成构建:
构建Linux环境的electron主要的步骤:
- 安装依赖:node、python(如需要)
- 将源代码上传到Linux环境
- 构建应用
安装步骤:
一、安装node
在Linux上安装nodejs,可以在windows上先下载把Linux版本的nodejs包下载到本地后,再拷贝到Linux上
1、查看Linux系统架构
uname -m | arch
2、下载nodejs
,Linux安装包下载:nodejs
3、下载到本地之后,将nodejs
压缩包上传到Linux服务器上,可以使用终端工具或者ssh传输MobaXTerm终端工具下载地址
将压缩包上传到服务器目录,一般是用户目录(/home/username)
~代表用户目录
4、将文件解压到指定nodejs的安装目录,这里安装到了/opt
目录下
在/opt下创建nodejs目录
cd /opt
mkdir nodejs
将压缩包拷贝到/opt/nodejs目录下
mv ~/node-v16.20.2-linux-x64.tar.xz /opt/nodejs
切换到/opt/nodejs目录下,解压压缩包
cd /opt/nodejs/
tar -xvf node-v16.20.2-linux-x64.tar.xz
记住解压的bin目录,后续设置环境变量
目录:
/opt/nodejs/node-v16.20.2-linux-x64/bin
5、使用vi或者vim命令编辑 /etc/profile
文件,将nodejs的bin目录添加到环境变量中
export PATH=“/opt/nodejs/node-v16.20.2-linux-x64/bin:$PATH”
vim /etc/profile
按下键盘的
i
即可编辑文件,在文件末尾添加环境变量,如下:设置完毕后,按下
esc
键退出编辑模式,输入:wq!
保存编辑并退出修改了环境变量文件之后,需要重新加载配置文件以生效,使用命令
source /etc/profile
输入
node -v
测试是否安装成功
二、安装python
我的程序用到
grpc
,涉及到了node与c++的调用,为了包之间的适配,需要借用python环境来重新构建依赖以完成grpc与electron的适配
1、将python3.11.5在windows上下载后,上传到Linux
安装步骤:
cd python-3.11.5
./configure --preofx=/opt/python3
make j 10
:同时运行十个作业,若失败的话,可以使用make
su
make install
2、将 python3
目录下的 bin
目录设置环境变量
- vim /etc/profile
- export PATH=$PATH:/opt/python3/bin
- 设置完成保存后,重新运行配置文件:source /etc/profile
三、构建electron
将windows下开发的electron源代码拷贝到Linux上,保证将windows版本的node_modules删除,在Linux上进行编译
1、在Linux上的electron源代码目录下,确保没有windows版本的node_modules,然后进行构建:
设置npm和electron的镜像,可以使用国内淘宝镜像顺利的下载资源,执行 npm config edit
执行 npm config edit之后,会进入到 npm 的配置文件,设置镜像
ELECTRON_BUILDER_BINARIES_MIRROR=https://npmmirror.com/mirrors/electron-builder-binaries/ ELECTRON_MIRROR=https://npmmirror.com/mirrors/electron/ registry=https://registry.npmmirror.com/
设置完镜像后退出
确保electron代码中对Linux下build进行了配置
linux: {icon,target: 'AppImage',maintainer: "zj" }
在electron的根目录下执行 npm install
我的代码中使用到了 grpc,可能会报错grpc与electron版本不兼容的问题,此时需要使用
electron-rebuild
来重新构建完成包之间的兼容安装了
electron-rebuild
之后,在 package.json 中的 scripts 中设置"rebuild": “electron-rebuild -f -w yourmodule”
执行
npm run rebuild
,开始重新构建。在我测试的时候发现:使用node16.20.2版本搭配python3.11.5版本可以完成rebuild
重新构建打包构建程序:
npm run electron:build
2、修改Linux下chrome-sandbox沙盒的权限
由于electron嵌入了Chromium和Node.js,
在Linux系统上,进程和文件的权限管理比其他操作系统更加严格和细粒度。
chrome-sandbox
是一个提升了特权的进程,它需要特定的权限来运行。
在构建代码后,运行.AppImage
程序,可能会报错:
The SUID sandbox helper binary was found, but is not configured correctly. Rather than run without sandboxing I'm aborting now. You need to make sure that /tmp/.mount_xxxxx/chrome-sandbox is owned by root and has mode 4755.
3、设置chrome-sandbox权限
需要将
node_modules/electron/dist/chrome-sandbox
设置权限为4755,并且设置root用户权限执行命令:
sudo chown root:root chrome-sandbox && sudo chmod 4755 chrome-sandbox
重新构建build
4、禁用沙盒
若设置chrome-sandbox权限后,重新构建仍然报错,可以禁用沙盒运行程序
在启动程序后面加参数
--no-sandbox
执行:
./electron-app --no-sandbox
。此时可以成功运行程序
环境变量配置
Linux上设置环境变量的两种方式:1. 全局设置,设置后所有用户生效 2. 设置属于指定用户的环境变量
- 全局:
/etc/profile/
- 设置PATH:
export PATH=/opt/nodejs/bin:$PATH
- 设置PATH追加:
export PATH=$PATH:/opt/python3/bin
- 设置完PATH之后需要重新运行:
source /etc/profile
- 设置PATH:
- 用户的环境变量:
~/.bashrc
|~/.cshrc