To distribute your app with Electron, you need to download Electron's prebuilt
binaries. Next, the folder
containing your app should be named
app and placed in Electron's resources
directory as shown in the following examples. Note that the location of
Electron's prebuilt binaries is indicated with
electron/ in the examples
electron/Electron.app/Contents/Resources/app/ ├── package.json ├── main.js └── index.html
On Windows and Linux:
electron/resources/app ├── package.json ├── main.js └── index.html
electron on Linux,
electron.exe on Windows),
and Electron will start as your app. The
electron directory will then be
your distribution to deliver to final users.
Apart from shipping your app by copying all of its source files, you can also package your app into an asar archive to avoid exposing your app's source code to users.
To use an
asar archive to replace the
app folder, you need to rename the
app.asar, and put it under Electron's resources directory like
below, and Electron will then try to read the archive and start from it.
electron/Electron.app/Contents/Resources/ └── app.asar
On Windows and Linux:
electron/resources/ └── app.asar
More details can be found in Application packaging.
After bundling your app into Electron, you will want to rebrand Electron before distributing it to users.
You can rename
electron.exe to any name you like, and edit its icon and other
information with tools like rcedit.
You can rename
Electron.app to any name you want, and you also have to rename
CFBundleName fields in the
You can also rename the helper app to avoid showing
Electron Helper in the
Activity Monitor, but make sure you have renamed the helper app's executable
The structure of a renamed app would be like:
MyApp.app/Contents ├── Info.plist ├── MacOS/ │ └── MyApp └── Frameworks/ └── MyApp Helper.app ├── Info.plist └── MacOS/ └── MyApp Helper
You can rename the
electron executable to any name you like.
Apart from packaging your app manually, you can also choose to use third party packaging tools to do the work for you:
It is also possible to rebrand Electron by changing the product name and
building it from source. To do this you need to set the build argument
corresponding to the product name (
electron_product_name = "YourProductName")
args.gn file and rebuild.
Creating a custom fork of Electron is almost certainly not something you will
need to do in order to build your app, even for "Production Level" applications.
Using a tool such as
electron-forge will allow you to
"Rebrand" Electron without having to do these steps.
You need to fork Electron when you have custom C++ code that you have patched directly into Electron, that either cannot be upstreamed, or has been rejected from the official version. As maintainers of Electron, we very much would like to make your scenario work, so please try as hard as you can to get your changes into the official version of Electron, it will be much much easier on you, and we appreciate your help.
Install Surf, via npm:
npm install -g surf-build@latest
Create a new S3 bucket and create the following empty directory structure:
- electron/ - symbols/ - dist/
Set the following Environment Variables:
ELECTRON_GITHUB_TOKEN- a token that can create releases on GitHub
ELECTRON_S3_SECRET_KEY- the place where you'll upload Node.js headers as well as symbols
ELECTRON_RELEASE- Set to
trueand the upload part will run, leave unset and
surf-buildwill do CI-type checks, appropriate to run for every pull request.
CI- Set to
trueor else it will fail
GITHUB_TOKEN- set it to the same as
SURF_TEMP- set to
C:\Tempon Windows to prevent path too long issues
TARGET_ARCH- set to
script/upload.py, you must set
ELECTRON_REPO to your fork (
especially if you are a contributor to Electron proper.
surf-build -r https://github.com/MYORG/electron -s YOUR_COMMIT -n 'surf-PLATFORM-ARCH'
Wait a very, very long time for the build to complete.