Skip to main content

How to compile Electron from source (for arm64 / x64)?

Sometimes if prebuilt binaries of electron are not available for your platform or if you want to modify the electron source to customize to your need, you are at the right place.

I had a requirement to have a <webview> tag inside another <webview> tag. Seems it is not supported out of the box.

As per the suggestion provided in the above link, I thought I could modify a couple of lines and see if it works. Coincidentally I am running Kubuntu arm64 build on M1 mac via parallels. So I wanted a aarch64 (a.k.a arm64) build.

So I provisioned a t4g.medium (2vCPU , 4 GB RAM) with Ubuntu 22.04 LTS. I tried checking out the code as mentioned below. But within 30 mins I ran out of CPU credits and had to switch to r6g.large (2vCPU , 16 GB RAM).

Code was checked out pretty fast (fast for 50GB of code). Yes you will need at least 60GB of disk. Ok, lets go through the steps for checking out and compiling.

Step-1: Prepare the build environment

sudo apt-get update && sudo apt-get upgrade
sudo apt-get install build-essential clang libdbus-1-dev libgtk-3-dev \
                       libnotify-dev libasound2-dev libcap-dev \
                       libcups2-dev libxtst-dev \
                       libxss1 libnss3-dev gcc-multilib g++-multilib curl \
                       gperf bison python3-dbusmock openjdk-8-jre
sudo apt-get install npm
sudo npm i -g yarn
sudo npm i -g  @electron/build-tools
You may not find gcc-multilib g++-multilib for arm64 Ubuntu. So you can skip them; more on that later. Now run e -help to see if you are getting any output or error. If you are getting help instructions, skip the next line.
sudo npm remove  @electron/build-tools
git clone https://github.com/electron/build-tools ~/.electron_build_tools
cd ~/.electron_build_tools
npm install
e –help

Step-2: download codebase and sync

This will take about an hour depending on you hardware and network.
e sync -v
You will get the following error.
husky@8.0.1: The engine "node" is incompatible with this module. Expected version ">=14". Got "12.22.9" 
This means your node is of older version. Install the latest version as shown below.
curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.1/install.sh | bash
nvm list-remote
nvm install v18.12.1 
nvm use v18.12.1
You can uninstall the old node version
sudo apt-get remove nodejs --purge

Then run,

e sync -v

Step-3: Build

e build
This command will fail because you can't compile chromium or electron on arm64 machine as per this. You can only cross compile arm64 on x64. I realized it later.
So I provisioned r6a.large.

Install the following to cross compile for arm64 along with instructions given in Step-1

sudo apt-get install libc6-dev-arm64-cross linux-libc-dev-arm64-cross \
                       g++-aarch64-linux-gnu
Add the following to configure the build for arm64
cd ~/electron/src
build/linux/sysroot_scripts/install-sysroot.py --arch=arm64
buildtools/linux64/gn gen out/Testing --args="import(\"//electron/build/args/testing.gn\")"

append the following line to electron/build/args/testing.gn

target_cpu = "arm64"
 Run the build command again.
e build

Voilà! build is successful. To create a dist file, run the following command.
e build electron:dist

Copy the file from /home/ubuntu/electron/src/out/Testing/dist.zip

That's all folks!

 

Comments

Popular posts from this blog

Installing GoDaddy certificate in Wildfly/Keycloak

In the previous post we saw how to set up Keycloak . Here we will see how to generate and install GoDaddy.com certificate in Keycloak. The steps are similar for Wildfly as well. Step 1: Generate CSR file Run the following commands in your terminal. <mydomain.com> has to be replaced with your actual domain name. keytool -genkey -alias mydomain_com -keyalg RSA -keysize 2048 -keystore mydomain_com.jks keytool -certreq -alias mydomain_com -file mydomain_com.csr -keystore mydomain_com.jks Step 2: Generate certificate Upload  mydomain_com . csr  file content into GoDaddy.com, generate and download certificate for tomcat server (steps to generating SSL certificate is beyond the scope of this article). If you unzip the file, you will see the following files. gd_bundle-g2-g1.crt ..5f8c...3a89.crt   #some file with alphanumeric name gdig2.crt Files 1 and 2 are of our interest. Third file is not required. Step 3: Import certificate to key store Download r

Using Nginx as proxy server for Keycloak

I have used Keycloak  in its very early stage ( when it is was in 2.x version). But now it has come a long way (at this time of writing it is in 21.x) In this article let's configure Keycloak behind Nginx. Here are the points to consider.  If you want to configure Apache2 as a proxy server for your java application, please check  this article . We are going to use a domain name other than localhost Anything other than localhost will require Keycloak to run in production mode which requires SSL configurations etc. Or it requires a proxy server. Lets begin. Requirements Keycloak distribution Ubuntu 22.04 server Configuring Keycloak 1. Download Keycloak from here . 2. Extract it using tar -xvzf  keycloak-21.0.1.tar.gz 3. Create a script file called keycloak.sh with the following contents #!/bin/bash export KEYCLOAK_ADMIN=<admin-username-here> export KEYCLOAK_ADMIN_PASSWORD=<admin-password-here> nohup keycloak-21.0.0/bin/kc.sh start-dev --proxy edge --hostname-strict=fa

Hibernate & Postgresql

If you are using Hibernate 3.5 or above to talk to Postgresql database, have you ever tried to store a byte array? Let's take an example. Here is the mapping which will store and read byte[] from the database. @Lob @Column(name = "image") private byte[] image; Here is the JPA mapping file configuration. <persistence version="2.0"  xmlns="http://java.sun.com/xml/ns/persistence"  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"  xsi:schemaLocation="http://java.sun.com/xml/ns/persistence http://java.sun.com/xml/ns/persistence/persistence_2_0.xsd">   <persistence-unit name="testPU" transaction-type="JTA">     <provider>org.hibernate.ejb.HibernatePersistence</provider>     <jta-data-source>test</jta-data-source>     <properties>     </properties>   </persistence-unit> </persistence> When you try to save your entity you will get t

Dynamic SOAP Service Client

If you have written SOAP service client, you might know that you need the WSDL file; need to generate Java code for that,compile that Java classes and add it as dependency for your module. What would you do if you have to incorporate your code with a new SOAP service every now and then? What would you do if all you need is to consume the service and do a little processing on the output, i.e., you need the data in XML format? What would you do if you don't have a complete WSDL? What would you do if your service is in .NET whose WSDL is having problem while generating Java classes? Is there a way to write a dynamic client which can consume any SOAP service? .... YES!... there is a way. Let's quickly write a web (SOAP) service. Software used: Java 7 NetBeans IDE 7.4 GlassFish 4.0 Maven Create a web project and choose Glassfish as server. Now add web service (not a rest service) as below. Edit the SimpleService.java as follows. package com.mycom

How to retry a method call in Spring or Quarkus?

Have you ever come across a situation where you wanted to retry a method invocation automatically? Let's say you are calling a stock ticker service for a given stock and get a transient error. Since it is a transient error, you will try again and it may work in second attempt. But what if it doesn't? Well, you will try third time. But how many times can you try like that? More importantly after how much time will you retry? Imagine if you have a handful of methods like this. Your code will become convoluted with retry logic. Is there a better way? Well, if you are using spring/spring boot, you are in luck. Here is how you can do that using spring. Let's write our business service as follows. import java.time.LocalDateTime; import java.util.concurrent.CompletableFuture; import lombok.extern.slf4j.Slf4j; import org.springframework.retry.annotation.Backoff; import org.springframework.retry.annotation.Retryable; import org.springframework.scheduling.annotation.Async; import