我也来编译个Electron吧

最近心血来潮想编译一下和CEF同源的Electron源码。虽然已经有很多CEF的经验，但在编译Electron的时候还是遇到了一些小问题，这里简单记录一下。

编译工具

我是按照Electron提供的 Build Tools 来编译的。因为之前经常编译CEF，所以像 depot_tools、git 这些早就有。然后按照指导，额外安装了 yarn，并且更新了我机器上的 npm 和 node.js版本。

编译过程

在Electron Build Tools指导页面上，针对init / sync / build 做出了详细的说明，并在一开始就给出了编译命令：

e init --root=~/electron --bootstrap testing

不过我为了理解Electron整个的编译细节，采取了分部执行的方式。（注：下文都是在Windows上执行的）

首先我使用 init 来初始化源码目录：

e init master-release -i release --root=D:\Electron\electron\

其中，master-release是随便起的名字。-i 后面可以跟testing或者release，我的理解对应的是CEF的debug和release版本。-i 应该是会使用 \electron\build\args\ 下的对应gn文件来完成编译。 \electron\build\args\ 下的gn里包含了若干关键设置，例如 rtc_use_h264 和 is_component_ffmpeg，这个在CEF上如果你不进行设置，编译出来的版本是不支持H.264的。

接下来使用 sync 来下载代码：

e sync

sync主要是利用 gclient （depot_tools包含的命令）来完成代码的下载和同步。这一步我没有遇到什么问题，下载还是比较顺溜的。主要是最近中美关系好像好了点了，我的代理工作的一直比较稳定，哈哈。

下载后的目录大概13~14GB。我看了一下和CEF的目录结构基本上差不多。都是在Chromium源码目录的基础上，增加了electron自己的文件夹，不过比CEF更多一点，例如 thiry_party 下多了 electron_node文件夹，这个是CEF没有的。

接下来就是正式的编译工作了。我执行了此命令：

e build

遇到的问题

Running “goma_ctl.py ensure_start” in … 长时间卡住不动

goma_ctl.py 这个脚本位于 C:\Users{计算机用户名}.electron_build_tools\third_party\goma\下，我终止掉命令后，手动在 goma 目录下运行 goma_ctl.py ensure_start 是OK的，所以感到很奇怪。

在排查这个问题的时候，看了一下 Electron Documentation 关于 Goma 的说明页面 ，访问了 localhost:8088 能够打开，看起来 Goma 是可以工作了的，就没有再继续研究卡住不动的原因了。

编译提示A依赖B，但B找不到

Running "ninja -j 200 electron" in D:\Electron\electron\src\out\Release
ninja: error: '../../electron/node_modules/@primer/octicons/build/build.css', needed by 'gen/electron/js/default_app/electron/default_app/octicon/build.css', missing and no known rule to make it

因为我对Node.js不是太熟悉，只有一些基本的了解，通过字面意思直觉是有些依赖库缺失了。所以查看了一下electron的package.json文件，发现上面错误提到的 @primer/octicons 是devDependencies下的一个：

然后查看了electron的node_modules文件夹内，看到果然只有很少的库，大量的库都没有下载。后来经过不断尝试，发现需要执行下面的命令：

npm config set -g production false

将production设置为false （可以通过命令 npm config get production 查看是true还是false），否则就会导致package.json里面的 devDependencies 下的库不会下载。

提示 Goma 没有登录

Not logged in. Run this command and retry the build:
pushd %GOMACLIENTDIR% && vpython goma_auth.py login && popd

根据这个提示，我执行了

pushd C:\Users\{计算机用户名}\.electron_build_tools\third_party\goma\ && vpython goma_auth.py login && popd

先是有一个y/n的协议需要确认，紧接着提示：

To sign in, use a web browser to open the page https://microsoft.com/devicelogin and enter the code 机器码 to authenticate.

按照指引，我访问了https://microsoft.com/devicelogin并输入机器码，结果丢给我这个：

很显然，我应该是没有登录Electron Goma的权限的，那你丫让我登录干啥。没办法，回到编译命令行窗口，Ctrl+C终止掉命令，重新执行 e build，神奇的事情发生了，这次没有提示任何错误了，编译继续往下走了：

看一下还没关闭的 localhost:8088，可以看到编译情况：

进程列表里好几十个 gomacc.exe 在努力地干着活：

按照我编译CEF的经验，不用盯着看了，啥时候等机器的风扇声音变小了再看吧 ^_

编译非master分支的Electron版本

使用 Electron Build Tools 编译方便是方便，但有个问题就是不能设定编译某一个Electron分支，默认就是编译master分支。我查阅了Electron Build Tools的相关命令和参数，没有发现指定某个分支来编译的参数。可能有，我没发现？
所以使用 Electron Build Tools 编译好 master 分支的版本后，我又折腾了一下手动切换Electron分支来编译。基本的流程如下，简单记录一下：

环境变量

我编译时的几个主要的环境变量设置：



注意：\src\electron\DEPS 中分别要执行 python 和 python3，所以需要保证这两个命令都已经配置好了。网上关于python2和python3共存的文章很多，这里就不赘述了。

我一开始就是因为没有配置python3所以导致上图中的update-external-binaries.py无法执行。

分支切换

我的代码目录结构是这样的：

首先，无论用什么方式，先手动将 \src\electron\ 切换到某个分支，比如我切换到了 10-x-y。然后在 \src\electron\ 下使用 npm install安装Electron的依赖库。

之后，在 D:\Electron\electron\ 下执行：

gclient sync --with_branch_heads --with_tags

注意在执行以前，最好配置好“你懂的”代理。顺利的话，gclient会把Chromium代码帮你同步好，并自动执行Electron的code patch等脚本。

顺便说一句，electron下的DEPS会记录其对应的Chromium版本，比如我切换到了 10-x-y 分支，对应的Chromium版本就是85.0.4183.121，这个看一下DEPS的内容就一目了然了。所以如果你想改变编译的一些配置，Electron下的DEPS这个文件就十分重要。

执行编译

这一步和编译Chromium、CEF差不多，就是先用gn gen产生ninja等文件，然后用ninja编译出二进制文件。顺序如下：

在 src 下执行：

gn gen out\Release--args="import(\"//electron/build/args/release.gn\")"

我这里直接就编译了 Release版本了，如果你想编译Debug版本，可以使用 electron testing.gn这个配置。

接下来使用ninja编译即可：

ninja -C out/Release electron

OK，等待完成吧，这是个漫长的过程：