electron | Build cross-platform desktop apps | Runtime Evironment library
kandi X-RAY | electron Summary
kandi X-RAY | electron Summary
Use Electron Fiddle to build, run, and package small Electron experiments, to see code examples for all of Electron's APIs, and to try out different versions of Electron. It's designed to make the start of your journey with Electron easier.
Support
Quality
Security
License
Reuse
Top functions reviewed by kandi - BETA
Currently covering the most popular Java, JavaScript and Python libraries. See a Sample of electron
electron Key Features
electron Examples and Code Snippets
Lines of Code : 334License : Permissive (MIT)
Copymkdir apex-app-desktop
cd apex-app-desktop
npm init
{
"name": "apex-app-desktop",
"version": "1.0.0",
"description": "APEX Desktop Application using Github Electron",
"main": "main.js",
"scripts": {
"test": "echo \"Error: no test speci ├── Contents (you are here!)
│
├── Architecture
│
├── * What can be used for?
│ ├── In Electron Project
│ └── In Nodejs/Electron Project
│
├── * Install
│
├── * Instruction1: ProcessManager
│ ├── Require it in main.js(electron)
│ $ npx degit sveltejs/template create-svelte-electron-app
$ cd create-svelte-electron-app
# It should look something like this
"dependencies": {}
"devDependencies": {
"@rollup/plugin-commonjs": "^17.0.0",
"@rollup/plugin-node-resolve": "^11.0.0" // Import the necessary Electron components.
const contextBridge = require('electron').contextBridge;
const ipcRenderer = require('electron').ipcRenderer;
// White-listed channels.
const ipc = {
'render': {
// From render to mconst electronApp = require('electron').app;
const electronBrowserWindow = require('electron').BrowserWindow;
const nodePath = require("path");
const os = require('os-utils');
let window;
function createWindow() {
const window = ne// Import the necessary Electron modules
const electronApp = require('electron').app;
const electronMenu = require('electron').Menu;
const isMac = process.platform === 'darwin'
const isWin = process.platform === 'win32'
function build() // Import the necessary Electron components.
const contextBridge = require('electron').contextBridge;
const ipcRenderer = require('electron').ipcRenderer;
// White-listed channels.
const ipc = {
'render': {
// From render to mconst popupLogin = (htmlFile, parentWindow, width, height) => {
// Get the customers id from whatever source necessary.
let id = 99;
// Create the window.
let modal = new BrowserWindow({
width: 600,
hei// Import the necessary Electron components.
const contextBridge = require('electron').contextBridge;
const ipcRenderer = require('electron').ipcRenderer;
// Exposed protected methods in the render process.
contextBridge.exposeInMainWorldconst electronApp = require('electron').app;
const electronBrowserWindow = require('electron').BrowserWindow;
const electronIpcMain = require('electron').ipcMain;
const nodePath = require("path");
// Prevent garbage collection
let windowCommunity Discussions
Trending Discussions on electron
QUESTION
When import 'semantic-ui-css/semantic.min.css' into a brand new Electron-Forge/Webpack5 project, I get the following:
ANSWER
Answered 2021-Jul-26 at 17:05Finally fixed it...
Electron-Forge installs a recent version of CSS-Loader, whereas the website still has quite an old version. Downgrading fixed the issue.
QUESTION
I need help debugging Webpack's Compression Plugin.
SUMMARY OF PROBLEM
- Goal is to enable asset compression and reduce my app's bundle size. Using the Brotli algorithm as the default, and gzip as a fallback for unsupported browsers.
- I expected a content-encoding field within an asset's Response Headers. Instead, they're loaded without the field. I used the Chrome dev tools' network tab to confirm this. For context, see the following snippet:
- No errors show in my browser or IDE when running locally.
WHAT I TRIED
- Using different implementations for the compression plugin. See below list of approaches:
- (With Webpack Chain API)
ANSWER
Answered 2021-Sep-30 at 14:59It's not clear which server is serving up these assets. If it's Express, looking at the screenshot with the header X-Powered-By, https://github.com/expressjs/compression/issues/71 shows that Brotli support hasn't been added to Express yet.
There might be a way to just specify the header for content-encoding manually though.
QUESTION
I'm using Mac M1 and I've just upgraded to Node 14.17.6LTS.
I tried to rebuild better_sqlite3 (7.4.3) using with electron builder (22.11.7) and I'm getting the following errors:
no member named 'GetContents' in 'v8::ArrayBuffer'
Any ideas how to solve this? Thanks in advance!
...
ANSWER
Answered 2021-Sep-23 at 01:15I'm using Mac M1 and I've just upgraded to Node 14.17.6LTS.
An interesting choice, given that Node 16 officially introduced M1 support.
no member named 'GetContents' in 'v8::ArrayBuffer'
See this doc. In short, GetContents was replaced by GetBackingStore in late 2019. Being a compatibility layer, nan adapted to this in early 2020.
So you'll probably have to ensure that the versions of all involved packages (Node, nan, electron, ...) match each other (in the sense of having been released around the same time and targeting each other).
QUESTION
I've upgraded to Electron 14, refactored my project to accomodate for the "Removed: remote module" breaking change, but I'm unable to compile it due to the following TypeScript error:
...ANSWER
Answered 2021-Sep-27 at 11:31Now Electron 14.0.1 is out, and this is how I could enable remote modules for both Main and Renderer processes (your webPreferences settings may vary).
First, install @electron/remote package (important: no --save-dev, as it needs to be bundled):
QUESTION
I'm trying to make an electron app that gets the file names of a directory in a repository. I just don't know how to do this with the api. I know there is a way, I just don't know how.
For example:
I want to get the file names in the src/ directory of a github repository using the api.
I use axios to make api requests.
...ANSWER
Answered 2022-Feb-01 at 17:57Use Get repository content endpoint, documented here
Check out an example using Octokit
List Repository contents View in FusebitQUESTION
I have an electron repo (https://github.com/MartinBarker/RenderTune) which used to work on windows 10 fine when ran with command prompt. After a couple months I come back on a new fresh windows 10 machine with an Nvidia GPU, and the electron app prints an error in the window when starting up:
...ANSWER
Answered 2022-Jan-03 at 01:54You can try disabling hardware acceleration using app.disableHardwareAcceleration() (See the docs). I don't think this is a fix though, it just makes the message go away for me.
main.js
QUESTION
I would like to use the react-to-print library to print an iframe from my Electron app. How can I use the iframe reference to get the correct window/element to print?
ANSWER
Answered 2022-Jan-01 at 12:22You need to convert the iframe object to Data URL. And load the URL in a new hidden BrowserWindow object.
Build data URL in Renderer process and send the URL to Main process using preload. In main process do the BrowserWindow.loadURL and printing.
App.js
QUESTION
I use webpack 4 and electron-builder to bundle and build my Electron app. I noticed that native node modules inside the node_modules directory of the app.asar bundle still contain their C++ source files.
Is there a way to exclude certain file extensions from the build step?
...ANSWER
Answered 2021-Dec-25 at 05:32electron-builder can exclude files in the files section of your package.json.
ExampleDefault pattern / is not added to your custom if some of your patterns is not ignore (i.e. not starts with !). package.json and /node_modules// (only production dependencies will be copied) is added to your custom in any case. All default ignores are added in any case — you don’t need to repeat it if you configure own patterns.
QUESTION
I recently started developing an Electron application, and I am using daisyUI's Tailwind CSS components for the appearance of the user interface. I want to make the main window of the application rounded; however, daisyUI is making this task pretty challenging.
As you can see in the screenshot below, by default, daisyUI adds a background color to the body. I added the .bg-transparent class to the body tag, in order to make the background transparent, but daisyUI does not let the change apply (note the corners):
On the contrary, if I don't add daisyUI's CSS file to the head tag, the body becomes transparent:
Here's my HTML code:
...ANSWER
Answered 2021-Dec-17 at 01:02Here you can read that daisyUI adds a few base styles if base is true in the tailwind.config.js file. Thus, I had to set base to false to solve my problem:
QUESTION
I'm trying to run cypress on a WSL with Ubuntu, this is what I'm getting:
...ANSWER
Answered 2021-Oct-19 at 14:32Cypress requires the ability to run its GUI. Depending on your Windows version, you likely need some additional configuration in order to run GUI applications in WSL:
For all Windows releases, make sure you install the required dependencies:
Community Discussions, Code Snippets contain sources that include Stack Exchange Network
Vulnerabilities
No vulnerabilities reported
Install electron
Use Electron Fiddle to build, run, and package small Electron experiments, to see code examples for all of Electron's APIs, and to try out different versions of Electron. It's designed to make the start of your journey with Electron easier.
Support
Reuse Trending Solutions
Find, review, and download reusable Libraries, Code Snippets, Cloud APIs from over 650 million Knowledge Items
Find more librariesStay Updated
Subscribe to our newsletter for trending solutions and developer bootcamps
Share this Page
