1. 概述

本文介绍怎么在Ubuntu20.04系统下，完成Electron项目的开发和发布。

2. 开发环境准备

2.1. update apt source with proxy

如果你不需要proxy可以直接访问外网，可以跳过此步

$ sudo vi /etc/apt/apt.conf
Acquire::http::Proxy "http://user:pass@proxy_host:port";
$ export http_proxy=http://user:pass@proxy_host:port
$ sudo apt update

参考：https://www.unixmen.com/45713-2/

2.2. change apt source list

$ sudo vi /etc/apt/sources.list
deb http://mirrors.aliyun.com/ubuntu/ focal main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ focal main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ focal-security main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ focal-security main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ focal-updates main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ focal-updates main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ focal-proposed main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ focal-proposed main restricted universe multiverse
deb http://mirrors.aliyun.com/ubuntu/ focal-backports main restricted universe multiverse
deb-src http://mirrors.aliyun.com/ubuntu/ focal-backports main restricted universe multiverse
$ sudo apt update

参考：https://blog.csdn.net/xiangxianghehe/article/details/105688062

2.3. install common soft

$ sudo apt install openssh-server tmux git vim net-tools -y

2.4. install nodejs environment

• 使用root用户操作

$ apt install nodejs npm -y

$ npm config set registry https://registry.npm.taobao.org
$ npm config list

$ vim /etc/bash.bashrc
export http_proxy=http://10.251.175.152:8000
export https_proxy=http://10.251.175.152:8000
export no_proxy=localhost,10.0.0.0/8,127.0.0.1,::1
$ source /etc/bash.bashrc

$ npm install -g n yarn
$ n i 14

• 测试一下子

$ n list
node/14.17.3
$ node -v
v14.17.3
$ yarn -v
1.22.10

2.5. 补充说明

以下是npm config关于proxy的说明，会默认系统的env，所以理论上，配好系统proxy的env就好

• https-proxy
  A proxy to use for outgoing https requests. If the HTTPS_PROXY or https_proxy or HTTP_PROXY or http_proxy environment variables are set, proxy settings will be honored by the underlying make-fetch-happen library.

• noproxy
  Also accepts a comma-delimited string.
  Default: The value of the NO_PROXY environment variable

关于no_proxy的配置

10.*可能只在部分场景可用，例如浏览器Proxy和Windows系统Proxy

在Cygwin64和Ubuntu20系统，需要用10.0.0.0/8，否则，你会一直纠结。。。

export no_proxy=localhost,10.0.0.0/8,127.0.0.1,::1

3. Build and Release

3.1. build your electron app

$ npx cross-env ELECTRON_GET_USE_PROXY=true GLOBAL_AGENT_HTTPS_PROXY=http://10.251.175.152:8000 yarn
$ yarn dev
$ yarn build
$ yarn release

3.2. publish

• package.json有几个必填的字段，例如author/homepage/license

"build": {
    "linux": {
      "icon": "build/icons/fox.png",
      "category": "Network",
      "artifactName": "${productName}-${os}-${arch}-${version}-setup.${ext}",
      "target": ["AppImage", "deb", "tar.gz"],
      "maintainer": "Shuzhang"
    },
}

3.3. auto-update

linux下build，如果target不写AppImage，而是其他，例如deb，会有两个问题：

• a. 不生成latest-linux.yml，导致publish失败
• b. 不生成app-update.yml，导致运行时auto-update失败，所以下面是一个workaround
• TODO: 可以尝试最新版本的electron-builder和electron，是否此问题依然存在

if (process.platform !== 'linux' || process.env.APPIMAGE) {
    updateHandle()
}

相关Issues：

• https://github.com/electron-userland/electron-builder/issues/2736
• https://github.com/electron-userland/electron-builder/issues/4704

3.4. Errors

• minio requesttimetooskewed

上传或下载文件时，出现上述错误，需要修改系统时间为当前时间

• UnmarshalError: failed to unmarshal error message

看一下html内容，如果是被网关拦截，说明noproxy配置有问题

4. Build Servers

上述发布方式，需要login到ubuntu机器，执行相关命令才能release。

如何在Windows上build其他主流OS的installer，electron-builder也给了解决办法，采用docker的方式。

Note: Don’t expect that you can build app for all platforms on one platform.
https://www.electron.build/multi-platform-build

4.1. Provided Docker Images

• electronuserland/builder or electronuserland/builder:12 — NodeJS 10 and required system dependencies. Based on builder:base. Use this image if you need to build only Linux targets.
• electronuserland/builder:wine — Wine, NodeJS 10 and required system dependencies. Based on builder:10. Use this image if you need to build Windows targets.
• electronuserland/builder:wine-mono — Mono for Squirrel.Windows. Based on builder:wine. Use this image if you need to build Squirrel.Windows target.
• electronuserland/builder:wine-chrome — google-chrome-stable and xvfb are available — you can use this image for headless testing of Electron application. Based on builder:wine.
• electronuserland/builder:base — Required system dependencies. Not supposed to be used directly.

4.2. Electron Build Service

Free public Electron Build Service is used to build Electron app for Linux on Windows.
To deploy, kubernetes is used for security reasons. Linux is required, but you can use multipass to run on macOS/Windows.

Two steps to setup:

• create kubernetes cluster, microk8s is highly recommended and used in this instruction

• deploy service

4.3. Travis

Travis to build macOS/Linux apps

https://www.electron.build/multi-platform-build#sample-travisyml-to-build-electron-app-for-macos-linux-and-windows

4.4. AppVeyor

AppVeyor to build Windows app

https://www.electron.build/multi-platform-build#sample-appveyoryml-to-build-electron-app-for-windows

5. 下一步计划

Electron跨平台支持，还需要

• 支持MacOS系统
• Linux发布流程改善，要支持deb、rpm等
• 尝试搭建Build Server，实现CI/CD，或者一键发布