Questions tagged [electron]

Electron (formerly Atom Shell) is a framework created by GitHub that lets you write cross-platform desktop applications using HTML, CSS and JavaScript. Electron is based upon Node.js and Chromium.

Electron (formerly Atom Shell) project was originally started by Cheng Zhao, one of the authors of NW.js (formerly known as node-WebKit), another Node.js-based platform for building desktop applications using HTML, CSS, and JavaScript. Cheng Zhao was hired by GitHub and began work on the framework on or about April 11th, 2013. On the 17th of April, 2015, with the release of version 0.24 the framework was renamed from Atom Shell to Electron.

One of the differences between Electron and NW.js frameworks is that the entry point for the app is actual JavaScript instead of an HTML page. This makes Electron more suitable for testing with PhantomJS, for instance.

Another difference is that the build process is also simpler for Electron using electron-builder, electron-forge and electron-packager. Since Electron uses libchromiumcontent to access Chromium's Content API, it's no longer required to obtain a copy of the Chromium source code. On that same note, the integration with Chromium is much more loosely coupled than in case of NW.js (which requires Chromium to be patched and maintained separately by the NW.js developers).

Probably, the most popular application built on top of Electron is a hackable text editor called Atom (also from GitHub). But there are some other interesting projects like Vivaldi Web browser, Mapbox Studio, an email client from Nylas, Slack desktop application, Pixate, Fireball game editor, Visual Studio Code, an SQL editor called Wagon, Mac app that runs Docker containers called Kitematic.


Resources :

15116 questions
48
votes
5 answers

How can we send messages from the main process to renderer process in Electron

I'm playing with electron for the first time. Trying to create a text editor In render I'm sending a message to indicated the content has changed and needs saving: document.getElementById('content').onkeyup = e => { ipcRenderer.send('SAVE_NEEDED',…
relidon
  • 2,142
  • 4
  • 21
  • 37
47
votes
15 answers

Tips on solving 'DevTools was disconnected from the page' and Electron Helper dies

I've a problem with Electron where the app goes blank. i.e. It becomes a white screen. If I open the dev tools it displays the following message. In ActivityMonitor I can see the number of Electron Helper processes drops from 3 to 2 when this…
Shane Gannon
  • 6,770
  • 7
  • 41
  • 64
47
votes
2 answers

How to add a right-click menu in Electron that has "Inspect Element" option like Chrome?

I'm building an Electron application and I would like to inspect specific UI elements. I have the Chrome dev tools open for development, but what I want is to be able to right-click a UI element and choose "Inspect Element" like I can in Google…
Tanner Semerad
  • 12,472
  • 12
  • 40
  • 49
45
votes
1 answer

Warning: 'sandbox' is not in the list of known options, but still passed to Electron/Chromium

I am using Linux Mint 20 and vscode 1.52.1. My ~/.xsession-errors file shows Warning: 'sandbox' is not in the list of known options, but still passed to Electron/Chromium. What is causing this error and what is the solution to it?
Ahmad Ismail
  • 11,636
  • 6
  • 52
  • 87
45
votes
1 answer

Electron IPC and nodeIntegration

So, I've followed a number of guides to set up Webpack, Electron, and React to make a desktop application. After finishing the setup, I got to work, and learned that I needed to require an IPC mechanism from the main and renderer in order to…
Antflga
  • 624
  • 1
  • 6
  • 9
45
votes
7 answers

Why do I see an "Electron Security Warning" after updating my Electron project to the latest version?

I've created Electron-Vuejs-Vuetify project from this Vuetify's boilerplate I'm seeing this warning in the console: Electron Security Warning This renderer process has Node.js integration enabled and attempted to load remote content. This exposes…
Un1
  • 3,874
  • 12
  • 37
  • 79
45
votes
6 answers

electron-rebuild "Unable to find Electron app ..."

After installing a native module via npm for use with Electron (atom shell) I'm trying to run electron-rebuild: >>./node_modules/.bin/electron-rebuild from the project directory,b "~/project_js/React-Redux-Py-Electron/" (which contains…
SteveB
  • 851
  • 2
  • 7
  • 15
44
votes
13 answers

dyld: Library not loaded: /usr/local/opt/openssl/lib/libcrypto.1.0.0.dylib

Using electron-builder to build Windows app, When signing up, I got this error : dyld: Library not loaded: /usr/local/opt/openssl/lib/libcrypto.1.0.0.dylib Referenced from:…
yiye
  • 863
  • 1
  • 7
  • 8
44
votes
1 answer

Distinction between the renderer and main processes in Electron

I originally thought that the renderer process in Electron was sandboxed in a chrome-like environment, meaning all you can do is mess with the DOM. However, I recently learned that you can access the filesystem, run child processes and get their…
rcplusplus
  • 2,767
  • 5
  • 29
  • 43
44
votes
5 answers

Open external file with Electron

I have a running Electron app and is working great so far. For context, I need to run/open a external file which is a Go-lang binary that will do some background tasks. Basically it will act as a backend and exposing an API that the Electron app…
Javier Cadiz
  • 12,326
  • 11
  • 55
  • 76
43
votes
5 answers

electron package: reduce the package size

I made a simple Electron app: main.js const {app, BrowserWindow} = require('electron') const path = require('path') const url = require('url') let win function createWindow () { win = new BrowserWindow({ width: 800, height: 600, …
ar099968
  • 6,963
  • 12
  • 64
  • 127
43
votes
0 answers

Performance-wise: Is a WPF application better than an Electron one coded wisely?

Recently, I have been reading about Electron and I got curious about its potential when compared to something already established in the market of building Windows 7 desktop applications (i.e., WPF). So far, I noticed that those who lean towards…
Mihai
  • 2,807
  • 4
  • 28
  • 53
43
votes
4 answers

Native looking UI components for Electron application

I'm using Electron (formerly Atom Shell) for a desktop application. It is a lot of fun to use and event-driven programming has its merits. I've got all HTML, CSS & JS power at my hands because it uses one of the more recent Chromium builds. I'd like…
Hedge
  • 16,142
  • 42
  • 141
  • 246
42
votes
10 answers

How to debug electron production binaries

I can't open devtools in the built version of my electron app. Therefore i want to find another solution to log any errors that only occur in the production version. Is there any good way to get some console.logs from an electron application if its…
Lucca
  • 1,447
  • 4
  • 16
  • 20
41
votes
3 answers

Difference between React-native and Electron

I want to build a simple read-only app which should run on Android, iOS, Windows, OSX and Linux. Does electron support mobile platform? I couldn't figure out which one should I go for.
mohitmun
  • 5,379
  • 3
  • 18
  • 16