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
40
votes
6 answers

How do you handle CORS in an electron app?

I'm building an electron app and need to call APIs where the API provider has not enabled CORS. The typically proposed solution is to use a reverse proxy which is trivial to do when running locally by using node and cors-anywhere like this: let…
Shagymoe
  • 1,296
  • 1
  • 15
  • 22
40
votes
1 answer

Electron app with database

I'm creating a web app for ticket reservation. The only problem is the database. I don't want to tell my client to install XAMPP or set a database, etc. Is there any way to package the app with the database?
gian29
  • 710
  • 2
  • 7
  • 9
40
votes
2 answers

How can I access the BrowserWindow JavaScript global from the main process in Electron?

I want a menu, defined in the main process to call JavaScript code inside the current browser window in an Atom or Electron application. Getting main process globals from the browser window is const remote = require('remote') const foo =…
Anna B
  • 5,997
  • 5
  • 40
  • 52
39
votes
11 answers

Cannot find module 'fs/promises' Electron JS

Good morning, I have created a program in Vue JS, this connects with an API that I have created in a main.js file to execute system commands. The problem I have is that when compiling for production with electron I get the following error: I use…
stillborn1
  • 507
  • 1
  • 4
  • 10
39
votes
7 answers

TypeError: window.require is not a function

Im trying to build an electron app and want to use window.require. Unfortunately the compiler says "TypeError: window.require is not a function". Ironically require works only in main.js. Here the code Im trying to run: const electron =…
Manfreds3
  • 670
  • 1
  • 6
  • 7
39
votes
2 answers

How to launch my electron app from a website

We have an electron crypto app that signs transactions (among other things). We want other websites to have the ability to have a button that opens that electron app, pre-filled with some params (the transaction information). flow is: user clicks…
Shining Love Star
  • 5,734
  • 5
  • 39
  • 49
38
votes
5 answers

How do I move a frameless window in Electron without using -webkit-app-region

I've been trying to move a frameless window on false but now I want to move the whole window just by dragging one element (the title bar), I've tried -webkit-app-region: drag; but it doesn't seem to work, I've also tried…
speed437
  • 409
  • 1
  • 4
  • 3
38
votes
7 answers

Electron - How to know when renderer window is ready

In my main process I create a renderer window: var mainWindow = new BrowserWindow({ height: 600, width: 800, x: 0, y: 0, frame: false, resizable: true }); mainWindow.openDevTools(); mainWindow.loadURL('file://' + __dirname +…
Joey
  • 10,504
  • 16
  • 39
  • 54
37
votes
8 answers

FontAwesome fails to load fonts locally and in electron app

I have downloaded FontAwesome using npm and then copied the css-file and the fonts into the right folders in the root-diretory of my electron-application using grunts copy task. So far so good. Everything is where it is supposed to be. Now, when i…
nozzleman
  • 9,529
  • 4
  • 37
  • 58
37
votes
9 answers

How to include Chrome DevTools in Electron?

I'm still new to Electron which I'm currently following here. I've read this page regarding on how to include the Chrome DevTools so that I can debug my application easily. I've followed the documentation but once I execute the electron
Rene Padillo
  • 2,250
  • 4
  • 26
  • 39
37
votes
9 answers

Disable pinch zoom in webkit (or electron)

Is there any way to disable pinch zoom in an electron app? I can't get it to work from inside the web-view with normal javascript methods as described here: https://stackoverflow.com/a/23510108/665261 It seems the --disable-pinch flag is not…
Billy Moon
  • 57,113
  • 24
  • 136
  • 237
36
votes
4 answers

Uncaught TypeError: URL is not a constructor using WHATWG URL object support for electron

I am trying to read a file using WHATWG URL object support here and I am getting this error: Uncaught TypeError: URL is not a constructor here is my code: var fs = require("fs"); const { URL } =…
Ana Houa
  • 901
  • 1
  • 8
  • 19
36
votes
3 answers

Electron open file/directory in specific application

I'm building a sort of File explorer / Finder using Electron. I want to open some file types with a specific application. I've tried the approach from this answer: Open external file with Electron import { spawn } from…
denislexic
  • 10,786
  • 23
  • 84
  • 128
35
votes
13 answers

electron - node.js - ng : file path\ng.ps1 cannot be loaded because running scripts is disabled on this system

I am trying to compile a project on Windows 10 in Visual Studio Code, my settings are the following: 1) npm version 6.12 2) Node.js version 12.13 3) Angular CLI: 8.3.19 The problem I have is as soon as I try to run ng serve I receive the following…
Emanuele
  • 2,194
  • 6
  • 32
  • 71
35
votes
4 answers

What's the proper way to handle forms in Electron?

The form html and submit event is part of the "renderer". The submitted data should be available in the main process. What's the proper way to submit the form and make that data accessible in main.js ? Should I simply use the "remote" module to pass…
Elfy
  • 1,733
  • 6
  • 19
  • 39