• Stars
    star
    244
  • Rank 159,765 (Top 4 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created over 5 years ago
  • Updated 2 months ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

The GN scripts to use for Electron dev-flows

Electron Build Tools

This repository contains helper/wrapper scripts to make building Electron easier.

Installation

A handful of prerequisites, such as git, python, and npm, are required for building Electron itself; these can be found in Platform Prerequisites. npm can be used with build-tools itself as well, but we've configured it to run with yarn, so we also recommend you install it to your system.

From here, you'll need a command-line prompt. On Mac and Linux, this will be a terminal with a shell, e.g. bash or zsh. You can also use these on Windows if you install them, or use built-in tools like Windows' Command Prompt.

Please note that build-tools (due to nested dependencies) might not work properly in powershell, please use cmd on Windows for optimum results.

# Install build-tools package globally:
npm i -g @electron/build-tools

Getting the Code and Building Electron

You can run a new Electron build with this command:

# The 'Hello, World!' of build-tools: get and build `main`
# Choose the directory where Electron's source and build files will reside.
# You can specify any path you like; this command defaults to `$PWD/electron`.
# If you're going to use multiple branches, you may want something like:
# `--root=~/electron/branch` (e.g. `~/electron-gn/main`)
e init --root=~/electron --bootstrap testing

That command's going to run for awhile. While you're waiting, grab a cup of hot caffeine and read about what your computer is doing:

Concepts

Electron's build-tools command is named e. Like nvm and git, you'll invoke e with commands and subcommands. See e --help or e help <cmd> for many more details.

e also borrows another inspiration from nvm: having multiple configurations that you can switch between so that one is the current, active configuration. Many choices go into an Electron build:

e holds all these variables together in a build configuration. You can have multiple build configurations and manage them in a way similar to nvm:

nvm e Description
nvm ls e show configs Show the available configurations
nvm current e show current Show which configuration is currently in use
nvm use <name> e use <name> Change which configuration is currently in use

Getting the source code is a lot more than cloning electron/electron. Electron is built on top of Chromium (with Electron patches) and Node (with more Electron patches). A source tree needs to have all of the above and for their versions to be in sync with each other. Electron uses Chromium's Depot Tools and GN for wrangling and building the code. e wraps these tools:

Command Description
e init Create a new build config and initialize a GN directory
e sync Get / update / synchronize source code branches
e build Build it!

e init

e init initializes a new local development environment for Electron.

To see all potential options for this command, run:

$ e init --help

New build configs are created with e init. It has several command-line options to specify the build configuration, e.g. the path to the source code, compile-time options, and so on. See e init --help for in-depth details.

Each build config has a name, chosen by you to use as a mnemonic when switching between build configs with e use <name>. This is the name's only purpose, so choose whatever you find easiest to work with β€” whether it's electron, 6-1-x--testing, or chocolate-onion-popsicle.

Each build also needs a root directory. All the source code and built files will be stored somewhere beneath it. e init uses $PWD/electron by default, but you can choose your own with --root=/some/path. If you want to make multiple build types of the same branch, you can reuse an existing root to share it between build configs.

As an example, let's say you're starting from scratch and want both testing and release builds of the main branch in electron/electron. You might do this:

# making 'release' and 'testing' builds from main

$ e init main-testing -i testing --root=~/src/electron
Creating '~/src/electron'
New build config 'main-testing' created
Now using config 'main-testing'
$ e show current
main-testing

$ e init main-release -i release --root=~/src/electron
INFO Root '~/src/electron' already exists.
INFO (OK if you are sharing $root between multiple build configs)
New build config 'main-release' created
Now using config 'main-release'

$ e show configs
* main-release
  main-testing

$ e show current
main-release
$ e show root
~/src/electron

$ e use main-testing
Now using config 'main-testing'
$ e show current
main-testing
$ e show root
~/src/electron

As a convenience, e init --bootstrap will run e sync and e build after creating the build config. Let's see what those do:

e sync

To see all potential options for this command, run:

$ e sync --help

e sync is a wrapper around gclient sync from Depot Tools. If you're starting from scratch, this will (slowly) fetch all the source code. It's also useful after switching Electron branches to synchronize the rest of the sources to the versions needed by the new Electron branch.

e sync is usually all you need. Any extra args are passed along to gclient itself.

$ e show current
main-testing

$ e show root
~/src/electron

$ e sync
Running "gclient sync --with_branch_heads --with_tags" in '~/src/electron/src'
[sync output omitted]

To make your output more verbose, you can add an increasing number of -vs. For example,

# basic verbosity
$ e sync -v
Running "gclient sync --with_branch_heads --with_tags -v" in '~/src/electron/src'
[sync output omitted]

# significant verbosity
$ e sync -vvvv
Running "gclient sync --with_branch_heads --with_tags -vvvv" in '~/src/electron/src'
[sync output omitted]

e build

e build builds an Electron executable.

To see all potential options for this command, run:

$ e build --help

Once you have the source, the next step is to build it with e build [target]. These build targets are supported:

Target Description
breakpad Builds the breakpad dump_syms binary
chromedriver Builds the chromedriver binary
electron Builds the Electron binary (Default)
electron:dist Builds the Electron binary and generates a dist zip file
mksnapshot Builds the mksnapshot binary
node:headers Builds the node headers .tar.gz file

As with syncing, e build [target] is usually all you need. Any extra args are passed along to ninja, so for example e build -v runs a verbose build.

Using Electron

After you've built Electron, it's time to use it!

Command Description
e start Run the Electron build
e node Run the Electron build as Node
e debug Run the Electron build in a debugger
e test Run Electron's spec runner

As usual, any extra args are passed along to the executable. For example, e node --version will print out Electron's node version.

e debug

e debug runs your local Electron build inside of lldb or gdb.

$ uname
Linux
$ e debug
Reading symbols from /home/yourname/electron/gn/main/src/out/Testing/electron...
(gdb)
$ uname
Darwin

$ e debug
target create "/Users/yourname/electron-gn/src/out/Testing/Electron.app/Contents/MacOS/Electron"
(lldb)

e test

e test starts the local Electron build's test runner. Any extra args are passed along to the runner.

To see all potential options for this command, run:

$ e test --help

Example:

# run all tests
e test

# run main process tests
e test --runners=main

Possible extra arguments to pass:

  • --node - Run Node.js' own tests with Electron in RUN_AS_NODE mode.
  • --runners=<main|native> - The set of tests to run, can be either main or native.

e show

e show shows information about the current build config.

To see all potential options for this command, run:

$ e show --help
Command Description
e show current The name of the active build config
e show configs Lists all build configs
e show env Show environment variables injected by the active build config
e show exe The path of the built Electron executable
e show root The path of the root directory from e init --root.
e show src [name] The path of the named (default: electron) source dir
e show stats Build statistics

Example usage:

$ uname
Darwin

$ e show exe
/Users/username/electron-gn-root/src/out/Testing/Electron.app/Contents/MacOS/Electron

$ uname
Linux

$ e show exe
/home/username/electron-gn-root/src/out/Testing/electron

$ e show out
Testing

$ e show src
/home/username/electron-gn-root/src/electron

$ cd `e show src base` && pwd
/home/username/electron-gn-root/src/base

$ ripgrep --t h TakeHeapSnapshot `e show src`

e remove <name>

e remove|rm <name> removes a build config from the list.

e open <commit | issue | PR>

e open opens the GitHub page for the specified commit, pull request, or issue.

To see all potential options for this command, run:

$ e open --help

For example, e open 0920d01 will find the commit with an abbreviated sha1 of 0920d01, see that it's associated with pull request #23450, and open electron/electron#23450 in your browser. Since you can pass in a pull request or issue number as well, e open 23450 would have the same effect.

e patches [patch-dir]

e patches exports patches to the specified patch directory in Electron source tree.

To see all potential options for this command, run:

$ e patches --help

Valid patch directories can include:

  • node
  • v8
  • boringssl
  • chromium
  • perfetto
  • icu
Command Source Directory Patch Directory
e patches node src/third_party/electron_node src/electron/patches/node
e patches chromium src src/electron/patches/chromium
e patches boringssl src/third_party/boringssl/src src/electron/patches/boringssl
e patches v8 src/v8 src/electron/patches/v8
e patches perfetto src/third_party/perfetto src/electron/patches/perfetto
e patches icu src/third_party/icu src/electron/patches/icu

e sanitize-config <name>

e sanitize-config updates and/or overwrites an existing config to conform to latest build-tools updates.

To see all potential options for this command, run:

$ e sanitize-config --help

Sometimes build-tools will make updates to its config requirements. In these events warnings will be output to console to inform you that build-tools has temporarily handled the issues. You can make these warnings go away either by manually updating your config files or by running this command to automatically overwrite the existing configs to update formatting.

e shell

e shell launches a shell environment populated with build-tools' environment variables and context.

Developers may for example find themselves wishing to access gn and ninja directly - instead of using e d gn to access that this command can be used. This also enables bash completion and the ability to copy-paste commands from Chromium docs without modification.

$ e shell
# Launching build-tools shell with "/bin/zsh"
# Running "/bin/zsh"

Common Usage

Building a Specific Electron Version

e init checks out the HEAD of the main branch. To build against a specific version of Electron, checkout that version with these commands:

# Change working directory to the Electron source directory
cd `e show src`

# Checkout the desired Electron version (in this case, 11.0.0)
git checkout tags/v11.0.0 -b v11.0.0

# Sync dependencies with the current branch
e sync

# Build Electron
e build

Advanced Usage

Per-Session Active Configs

If you want your shell sessions to each have different active configs, try this in your ~/.profile or ~/.zshrc or ~/.bashrc:

export EVM_CURRENT_FILE="$(mktemp --tmpdir evm-current.XXXXXXXX.txt)"

This will create per-shell temporary files in which the active config file can be changed with e use.

Disabling Automatic Updates

With the default configuration, build-tools will automatically check for updates every 4 hours.

You can enable and disable these automatic updates with the following commands:

$ e auto-update enable
$ e auto-update disable

Regardless of whether automatic updates are enabled, you can manually call the following command to immediately trigger an update.

$ e auto-update check

More Repositories

1

electron

:electron: Build cross-platform desktop apps with JavaScript, HTML, and CSS
C++
111,759
star
2

electron-quick-start

Clone to try a simple Electron app
JavaScript
10,851
star
3

electron-api-demos

Explore the Electron APIs
HTML
10,236
star
4

fiddle

:electron: πŸš€ The easiest way to get started with Electron
TypeScript
7,312
star
5

forge

:electron: A complete tool for building and publishing Electron applications
TypeScript
6,117
star
6

asar

Simple extensive tar-like archive format with indexing
JavaScript
2,426
star
7

apps

A collection of apps built on Electron
JavaScript
1,655
star
8

electronjs.org-old

Electron website
Handlebars
1,588
star
9

windows-installer

Build Windows Installers for Electron apps
TypeScript
1,529
star
10

rcedit

Command line tool to edit resources of exe
C++
1,502
star
11

electron-quick-start-typescript

Clone to try a simple Electron app (in TypeScript)
TypeScript
1,176
star
12

rebuild

Package to rebuild native Node.js modules against the currently installed Electron version
TypeScript
980
star
13

update-electron-app

🌲 A drop-in module that adds autoUpdating capabilities to Electron apps
TypeScript
682
star
14

i18n

🌍 The home of Electron's translated documentation
TypeScript
623
star
15

simple-samples

Minimal Electron applications with ideas for taking them further
JavaScript
610
star
16

update.electronjs.org

πŸ“‘ A free service that makes it easy for open-source Electron apps to update themselves.
JavaScript
556
star
17

osx-sign

Codesign Electron macOS apps
TypeScript
538
star
18

libchromiumcontent

Shared library build of Chromium’s Content module
Python
484
star
19

remote

Bridge JavaScript objects from the main process to the renderer process in Electron.
TypeScript
351
star
20

get

Download Electron release artifacts
TypeScript
325
star
21

releases

πŸ“¦ Complete and up-to-date info about every release of Electron
JavaScript
245
star
22

mini-breakpad-server

Minimum breakpad crash reports collecting server
CoffeeScript
237
star
23

node

Node fork to make it suitable for embedding in Electron
231
star
24

node-rcedit

Node module to edit resources of exe
JavaScript
183
star
25

node-abi

🐒 πŸš€ Get the Node.js and Electron ABI for a given target and runtime
JavaScript
154
star
26

governance

Public repository for governance issues and documents
Shell
136
star
27

sheriff

Controls and monitors organization permissions across GitHub, Slack and GSuite. Built with ❀️ by The Electron Team
TypeScript
131
star
28

chromedriver

Download ChromeDriver for Electron
JavaScript
128
star
29

typescript-definitions

Convert the Electron API JSON file to electron.d.ts
TypeScript
120
star
30

mksnapshot

Electron mksnapshot binaries
JavaScript
102
star
31

universal

Create Universal macOS applications from two x64 and arm64 Electron applications
TypeScript
102
star
32

notarize

Notarize your macOS Electron Apps
TypeScript
95
star
33

website

:electron: The Electron website
TypeScript
89
star
34

packager

Customize and package your Electron app with OS-specific bundles (.app, .exe, etc.) via JS or CLI
TypeScript
75
star
35

trop

automate the backporting process
TypeScript
70
star
36

node-minidump

Node module to process minidump files
JavaScript
68
star
37

pdf-viewer

Fork of Chrome pdf extension to work as webui page in Electron
JavaScript
51
star
38

clerk

Verify PRs have release notes
TypeScript
48
star
39

hubdown

Convert markdown to GitHub-style HTML using a common set of remark plugins
JavaScript
39
star
40

native-mate

Fork of Chromium's gin library that makes it easier to marshal types between C++ and JavaScript.
C++
38
star
41

download-stats

⬇️ Download stats for Electron. Updated daily.
JavaScript
34
star
42

fuses

TypeScript
32
star
43

crashpad

Electron fork of crashpad
C++
31
star
44

symbolicate-mac

Symbolicate macOS Electron crash reports
JavaScript
30
star
45

onboarding-guide

or, "So You Want to Be an Electron Hacker"
30
star
46

chromium-breakpad

GitHub clone of the breakpad used by Chromium
C++
29
star
47

node-chromium-pickle-js

Binary value packing and unpacking library compatible with Chromium's Pickle class
JavaScript
22
star
48

electron-docs-linter

Parse and validate Electron's API documentation
JavaScript
21
star
49

nightlies

Nightly release store
19
star
50

docs-parser

Parse Electron docs in a lossless way into a JSON file
TypeScript
19
star
51

cation

Electron's PR monitoring bot
TypeScript
18
star
52

be

Scripts to help building Electron
JavaScript
18
star
53

season-of-docs-2020

πŸ“– Project repository for Electron's possible participation in Google's Season of Docs
18
star
54

debian-sysroot-image-creator

Scripts to create debian sysroot image for building electron
Shell
18
star
55

dependent-repos

Public GitHub repos that depend on Electron. spiritual successor to https://github.com/electron/repos-using-electron
JavaScript
18
star
56

asar-require

Enable "require" scripts in asar archives
CoffeeScript
18
star
57

packages

A collection of all npm packages that mention `electron` in their package.json
JavaScript
17
star
58

symbol-server

Electron symbol server
TypeScript
14
star
59

unreleased

Checks for and reports commits unreleased for a specific release branch.
JavaScript
13
star
60

windows-sign

Codesign Electron apps for Windows
TypeScript
13
star
61

archaeologist

Digging up your artifacts since 2018
TypeScript
13
star
62

algolia-indices

Algolia search index data for Electron APIs, Tutorials, Packages, and Repos
JavaScript
13
star
63

fiddle-core

Run fiddles from anywhere, on any Electron release
TypeScript
13
star
64

electron-frameworks

Frameworks used by Electron
11
star
65

search-with-your-keyboard

Add keyboard navigation to your existing client-side search interface.
JavaScript
10
star
66

electron-api-historian

Find the birthday of every Electron API
JavaScript
9
star
67

gyp

Python
9
star
68

electron-api-docs

πŸ“ Electron's API documentation in a structured JSON format [ARCHIVED]
JavaScript
9
star
69

build-tools-installer

Installer for Electron's wrapper toolkit for working with Electron.js source code
JavaScript
9
star
70

build-images

Base docker image used to build Electron on CI
Shell
9
star
71

github-app-auth

Gets an auth token for a repo via a GitHub app installation
TypeScript
8
star
72

electron-docs

Fetch Electron documentation as raw markdown strings
JavaScript
8
star
73

.github

organization-wide defaults for all electron/* repos
7
star
74

bugbot

Making life easier for people who report or triage Electron issues.
TypeScript
6
star
75

node-is-valid-window

Validates if a pointer to window is valid.
C++
5
star
76

circleci-oidc-secret-exchange

Provides dynamic access to secrets in exchange for a valid OIDC token
TypeScript
5
star
77

electron-translators

Everyone who has helped translate Electron's documentation into different languages.
JavaScript
5
star
78

electron-userland-reports

Slices of data about packages, repos, and users in Electron userland. Collected from the GitHub API, npm registry, and libraries.io
JavaScript
5
star
79

rfcs

5
star
80

roller

🎡rollin on upstream 🎡
TypeScript
4
star
81

eslint-config

ESLint config used by Electron and Electron maintained modules
JavaScript
4
star
82

tweets

3
star
83

electron-website-updater

JavaScript
3
star
84

zoilist

Nag @electron/api-wg to do API reviews
TypeScript
3
star
85

lint-roller

JavaScript
2
star
86

github-app-auth-action

TypeScript
2
star
87

libcc-check

A little tool for checking up on libchromiumcontent builds.
JavaScript
2
star
88

slack-chromium-helper

Slack bot to unfurl Chromium development URLs
TypeScript
2
star
89

electron-issues

An experiment to better understand the issues filed on the electron/electron repo
JavaScript
2
star
90

hippo

TypeScript
2
star
91

ventifact

TypeScript
2
star
92

node-orb

Shell
1
star
93

electron-notarize

Notarize your macOS Electron Apps
TypeScript
1
star
94

docs-reviewer

TypeScript
1
star