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
351
votes
21 answers

Electron: jQuery is not defined

Problem: while developing using Electron, when you try to use any JS plugin that requires jQuery, the plugin doesn't find jQuery, even if you load in the correct path using script tags. For example,

Click me!

...
Bruno Vaz
  • 4,992
  • 6
  • 17
  • 27
238
votes
11 answers

Electron require() is not defined

I'm creating an Electron app for my own purpose. My problem is when I'm using node functions inside my HTML page it throws an error of: 'require()' is not defined. Is there any way to use Node functionalities in all my HTML pages? If it is…
Mari Selvan
  • 3,598
  • 3
  • 21
  • 36
233
votes
17 answers

Remove menubar from Electron app

How do I remove this menu-bar from my electron apps: Also it says "Hello World"(is this because I downloaded electron pre-built, and will go away once I package the application?). I didn't code these into the html, so I don't know how to get it…
Sean Letendre
  • 2,623
  • 3
  • 14
  • 32
215
votes
2 answers

How to unpack an .asar file?

I have packed my Electron application using the following command: asar pack app app.asar Now, I need to unpack it and get the whole code back. Is there any way to do so?
Vikas Bansal
  • 10,662
  • 14
  • 58
  • 100
214
votes
15 answers

How to set app icon for Electron / Atom Shell App

How do you set the app icon for your Electron app? I am trying BrowserWindow({icon:'path/to/image.png'}); but it does not work. Do I need to pack the app to see the effect?
Jo E.
  • 7,822
  • 14
  • 58
  • 94
201
votes
1 answer

What is the Visual Studio Code editor built on

What underlying technologies/libraries is Microsoft's new (free) cross platform editor Visual Studio Code (Launched 5/29/2015) built on? There are rumors that it's just Github's Atom Editor rebranded.
Sevin7
  • 6,296
  • 4
  • 23
  • 31
162
votes
17 answers

Using console.log() in Electron app

How can I log data or messages to the console in my Electron app? This really basic hello world opens the dev tools by default, by I am unable to use console.log('hi'). Is there an alternative for Electron? main.js var app = require('app'); var…
Don P
  • 60,113
  • 114
  • 300
  • 432
161
votes
24 answers

How to enable file upload on React's Material UI simple input?

I am creating a simple form to upload file using electron-react-boilerplate with redux form & material ui. The problem is that I do not know how to create input file field because material ui does not support upload file input. Any ideas on how to…
gintoki27
  • 1,761
  • 2
  • 13
  • 11
153
votes
5 answers

What are the functional differences between NW.js, Brackets-Shell and Electron?

Now that TideSDK is effectively dead, I've been looking into alternative 'wrappers' to run HTML/CSS/JS applications as stand-alone desktop applications. The three viable options I have run across so far, are NW.js (formerly node-webkit),…
Sven Slootweg
  • 3,735
  • 3
  • 21
  • 29
145
votes
5 answers

electron-builder vs electron-packager

What is main difference between electron-builder and electron-packager. Is there some example projects for both? Which is better for standalone .exe application build?
Ondrej Sika
  • 1,715
  • 2
  • 11
  • 12
139
votes
6 answers

Typescript + React/Redux: Property "XXX" does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes

I'm working on a project with Typescript, React and Redux (all running in Electron), and I've run into a problem when I'm including one class based component in another and trying to pass parameters between them. Loosely speaking, I've got the…
Protagonist
  • 2,219
  • 2
  • 12
  • 12
111
votes
10 answers

How to use sqlite3 module with electron?

I want to develop desktop app using electron that uses sqlite3 package installed via npm with the command npm install --save sqlite3 but it gives the following error in electron browser console Uncaught Error: Cannot find module…
manas
  • 6,119
  • 10
  • 45
  • 56
101
votes
5 answers

How to use preload.js properly in Electron

I'm trying to use Node modules (in this example, fs) in my renderer processes, like this: // main_window.js const fs = require('fs') function action() { console.log(fs) } Note: The action function gets called when I press a button in my…
Amir Shabani
  • 3,857
  • 6
  • 30
  • 67
95
votes
6 answers

Where to store user settings in Electron (Atom Shell) Application?

I can't seem to locate a built in mechanism to store user settings. I was hoping that electron provided a standard method for storing user settings across all desktop platforms. If there isn't a precedent for this I can implement it myself, I just…
CodeManiak
  • 1,903
  • 4
  • 19
  • 32
92
votes
4 answers

How to access DOM elements in electron?

I am trying to add functionality to a button in index.html file is as follows: I have a button element in index.html In main.js of the app, I have require('crash-reporter').start(); console.log("oh…
ant_1618
  • 1,861
  • 4
  • 17
  • 26
1
2 3
99 100