Electron 编译

转自：http://www.crabx.site/u/zerocode1337/2016-1-12/5694bc70aa2843950acd553a

参考：https://chromium.googlesource.com/chromium/src/+/master/docs/windows_build_instructions.md

前言：　electron是atom的兄弟开源项目,与NW.js类似，可以让用户使用web技术，创建跨平台的桌面应用，electron使用chromium内核、V8引擎和Node.js构建，由于产品需求，官方的版本无法满足功能上的需求，所以我们需要修改chromium内核达到我们的功能需求（在body中插入一行js代码）。本文只针对编译过程中遇到的问题做些说明，对内核修改不做赘述，旨在记录大项目编译过程心得，以为今后版本升级、维护、扩展性开发提供参考。

---

请确保所有工作是在稳定VPN环境下，否则中间会出现各种问题

解决部分环境依赖问题

linux(ubuntu)

• python 2.7x
• node.js v0.12.x
• Clang 3.4 or later　 这个编译器会在执行脚本的时候自行下载更新
• Development headers of GTK+ and libnotify.

在ubuntu上需要安装下列库 执行下述命令

sudo apt-get install build-essential clang libdbus-1-dev libgtk2.0-dev \                       libnotify-dev libgnome-keyring-dev libgconf2-dev \                       libasound2-dev libcap-dev libcups2-dev libxtst-dev \                       libxss1 libnss3-dev gcc-multilib g++-multilib

一般Linux 自带Python,所以只需要安装node.js即可（最好安装v 5.x版本）

windows

• windows7 / Server 2008 R2 or highter
• Visual Studio 2013 Community versioin is ok
• Python 2.7
• Node.js
• Git

系统必须问英文语言，这在chromoum编译中尤为重要，必须安装vs2013(除了2013别的目前请不要尝试)，python　node.jsGit 直接去官网下，傻瓜式安装，不过python 需要配置环境变量。

mac

• ox x >= 10.8
• Xcode >= 5.1
• node.js v5.X
• pyobjc

pyobjc 的安装可以尝试如下命令

$ sudo easy_install -U pyobjc-core$ sudo easy_install -U pyobjc

如果出现错误，需要前往下面网址下载，没错误请忽略

pyobjc-core

pyobjc-framework-Cocoa

pyobjc-framework-Quartz

分别解压后执行如下命令

python setup.py install

electron源码下载

linux mac win都执行如下命令即可,特别提示：windows最好使用git GUI 命令行工具

$ git clone https://github.com/atom/electron.git

启动python脚本

　在electron目录下有script文件夹，bootstrap.py脚本会自动下载所需依赖,前提是有python2.7.

执行如下命令

$ cd electron$ ./script/bootstrap.py -v　　//（linux 和　mac 下执行这个命令）$ python ./script/bootstrap.py -v //(windwos下执行这个命令)

这个过程会很久，linux下首先会更新当前环境中的clang（这步有错误就多换几个代理），mac和win类似，然后会更新一些依赖并下载chromium库。我们发现下载的chromium库是atom下的另一个子项目，所以这步是分水岭。

替换libchromium

上步说到，chromium库是atom下的另一个子项目，我们可以通过链接访问github项目主页，这个其实就是electron所需要的对应版本的chromium内核。写文档时编译的版本为 47.0.2526.73

下载

执行　git clone https://github.com/atom/libchromiumcontent.git 将项目下载到本地目录，打开目录

执行如下命令：

$ script/bootstrap   //（linux or mac）$ python script/bootstrap  //（windows）

更新

然后下载源码，更新组件和依赖,大约40分钟

$ script/update -t x64   //(linux or mac)$ python script/update -t x64  // (windows)

编译

最后编译，大约２－３个小时

$ script/build -t x64   //(linux or mac)$ python script/build -t x64   // (windows)

定制

以上工作只是编译官方给出的chromium版本内核，我们还需要修改源码，再编译（不要担心，再编译速度会很快）

研究后我们发现有个vender/chromium/src目录，这是放源码的地方。打开vendor/chromium/src/third_party/WebKit/Source/core/html/parser,将事先准备的代码手动修改（不能直接替换，最好根据git diff 来手动修改）。

修改完毕后，再次执行编译命令

$ script/build -t x64   //(linux or mac)$ python script/build -t x64  //(windows)

替换相应文件到electron

接下来就可以替换我们编译好的文件到electron目录了 在linux平台上找到以下7个文件

./out/Release/libwebcore_rendering.a./out/Release/libwebcore_generated.a./out/Release/libwebcore_html.a./out/Release/libwebcore_remaining.a./out/Release/libwebcore_dom.a./out/Release/libwebcore_svg.a./out_component/Release/lib/libwebcore_shared.so

如果是windows平台找到

./out/Release/webcore_rendering.lib./out/Release/webcore_generated.lib./out/Release/webcore_html.lib./out/Release/webcore_remaining.lib./out/Release/webcore_dom.lib./out/Release/webcore_svg.lib./out_component/Release/webcore_shared.dll./out_component/Release/webcore_shared.dll.lib

如果是mac平台找到

./out/Release/libwebcore_rendering.a./out/Release/libwebcore_generated.a./out/Release/libwebcore_html.a./out/Release/libwebcore_remaining.a./out/Release/libwebcore_dom.a./out/Release/libwebcore_svg.a./out_component/Release/lib/libwebcore_shared.dylib

以linux为例说明如何替换 将以上所有.a文件替换到electron的　/vendor/brightray/vendor/download/libchromiumcontent/static_library目录里 将.so 文件替换到electron的　/vendor/brightray/vendor/download/libchromiumcontent/shared_library目录里

编译electron

• 如果想同时建立发行版本和debug版本,执行下列命令 $ ./script/build.py

• 这个脚本会在out/R目录中产生非常大的文件（大约1.3G）,为了节约空间可以执行下列命令

  $ ./script/create-dist.py

至此我们成功编译了electron，并且可以在electron目录下找到dist文件夹，里面有两个压缩包，与官方提供的基本一致。

---

Do one thing , and do it well !