Electron FAQ

May 25, 2021 Electron

1. When will Electron upgrade to the latest version of Chrome?

2. When will Electron upgrade to the latest version of node .js?

3. How do I share data between two pages?

4. Why do applied windows and trays disappear after a while?

5. In Electron, why can't I use jQuery, RequireJS, Meteor, AngularJS?

6. Why require('electron').xxx result is undefined?

When will Electron upgrade to the latest version of Chrome?

Typically, we update the Chrome version in Electron within two weeks of the release of the stable version of Chrome.

We'll only use the stable version of Chrome. But if there's an important update in the beta or dev version, we'll apply the patch to the current version of Chrome.

When will Electron upgrade to the latest version of node .js?

We typically update Electron to this version .js node about a month after the release of the latest version of node .js. In this way, we avoid bugs (which are .js the new version of Node's system).

The new .js Node is usually brought about by the new version of V8. Because Electron uses the V8 engine that comes with Chrome, there are often new features in Electron that are already available with .js version of Node.

How do I share data between two pages?

The easiest way to share data between two Web pages (rendering processes) is to use the HTML5 API already implemented in the browser, which is a better scenario with storage API, localStorage sessionStorage or IndexedDB.

You can also implement it using the IPC mechanism within Electron. The data is present in a global variable of the main process, and then accessed using the remote module in multiple rendering processes.

// 在主进程中
global.sharedObject = {
  someProperty: 'default value'
};

// 在第一个页面中
require('remote').getGlobal('sharedObject').someProperty = 'new value';

// 在第二个页面中
console.log(require('remote').getGlobal('sharedObject').someProperty);

Why do applied windows and trays disappear after a while?

This is usually because the variables used to store windows and trays are garbage collected.

You can refer to the following two articles to understand why you are encountering this problem.

If you just want a quick fix, you can change the scope of the variable in the following way to prevent it from being garbage collected.

From

app.on('ready', function() {
  var tray = new Tray('/path/to/icon.png');
})

Change to

var tray = null;
app.on('ready', function() {
  tray = new Tray('/path/to/icon.png');
})

In Electron, why can't I use jQuery, RequireJS, Meteor, AngularJS?

Because Electron introduces node data in the .js environment, there are some additional variables in the DOM, such module exports require This results in many libraries not functioning properly because they also need to add variables of the same name to the running environment.

We can solve this .js by disabling node data:

// 在主进程中
var mainWindow = new BrowserWindow({
  webPreferences: {
    nodeIntegration: false
  }
});

If you still need to use the .js and Electron, you need to rename these variables before introducing those libraries, such as:

<head>
<script>
// 重命名 Electron 提供的 require
window.nodeRequire = require;
delete window.require;
delete window.exports;
delete window.module;
</script>
<script type="text/javascript" src="jquery.js"></script>
</head>

Why `require('electron').xxx` result is undefined?

When you use the modules provided by Electron, you may encounter errors similar to the following:

> require('electron').webFrame.setZoomFactor(1.0);
Uncaught TypeError: Cannot read property 'setZoomLevel' of undefined

This is because you have installed the electron module acquired on electron in your project or globally, which overwrwed the built-in module of electron.

You can confirm that you are electron module by outputing the path of the electron module in the following ways.

console.log(require.resolve('electron'));

Make sure it's not like this:

"/path/to/Electron.app/Contents/Resources/atom.asar/renderer/api/lib/exports/electron.js"

If the path to the node_modules/electron/index.js you need to remove or rename the electron module electron npm.

npm uninstall electron
npm uninstall -g electron

If you're still experiencing this problem, you might want to check the spelling or whether the module was called in the wrong process. For example, require('electron').app be used in the main process, while the need require('electron').webFrame used in the rendering process.