2014-05-05 14:49:05 +08:00
|
|
|
# Synopsis
|
|
|
|
|
|
2016-04-22 10:30:49 -07:00
|
|
|
> How to use Node.js and Electron APIs.
|
2016-04-21 15:35:29 -07:00
|
|
|
|
2016-10-13 21:09:14 +00:00
|
|
|
All of [Node.js's built-in modules](https://nodejs.org/api/) are available in
|
2015-08-28 22:46:31 -07:00
|
|
|
Electron and third-party node modules also fully supported as well (including
|
|
|
|
|
the [native modules](../tutorial/using-native-node-modules.md)).
|
2014-05-05 14:49:05 +08:00
|
|
|
|
2015-04-16 11:31:12 +08:00
|
|
|
Electron also provides some extra built-in modules for developing native
|
2015-09-04 13:44:40 -07:00
|
|
|
desktop applications. Some modules are only available in the main process, some
|
2015-09-01 15:42:10 -07:00
|
|
|
are only available in the renderer process (web page), and some can be used in
|
2015-08-28 22:46:31 -07:00
|
|
|
both processes.
|
|
|
|
|
|
2015-11-12 22:24:11 +08:00
|
|
|
The basic rule is: if a module is [GUI][gui] or low-level system related, then
|
|
|
|
|
it should be only available in the main process. You need to be familiar with
|
2018-04-09 17:58:10 -03:00
|
|
|
the concept of [main process vs. renderer process](../tutorial/application-architecture.md#main-and-renderer-processes)
|
2016-04-22 22:53:26 +09:00
|
|
|
scripts to be able to use those modules.
|
2014-05-05 14:49:05 +08:00
|
|
|
|
2018-05-08 00:16:09 -05:00
|
|
|
The main process script is like a normal Node.js script:
|
2014-05-05 14:49:05 +08:00
|
|
|
|
|
|
|
|
```javascript
|
2016-07-25 18:39:25 -07:00
|
|
|
const {app, BrowserWindow} = require('electron')
|
|
|
|
|
let win = null
|
2014-05-05 14:49:05 +08:00
|
|
|
|
2016-05-04 11:59:40 -06:00
|
|
|
app.on('ready', () => {
|
2016-07-25 18:39:25 -07:00
|
|
|
win = new BrowserWindow({width: 800, height: 600})
|
|
|
|
|
win.loadURL('https://github.com')
|
|
|
|
|
})
|
2014-05-05 14:49:05 +08:00
|
|
|
```
|
|
|
|
|
|
2015-11-12 22:24:11 +08:00
|
|
|
The renderer process is no different than a normal web page, except for the
|
|
|
|
|
extra ability to use node modules:
|
2014-05-05 14:49:05 +08:00
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
<!DOCTYPE html>
|
|
|
|
|
<html>
|
2015-11-12 22:24:11 +08:00
|
|
|
<body>
|
|
|
|
|
<script>
|
2016-07-25 18:39:25 -07:00
|
|
|
const {app} = require('electron').remote
|
|
|
|
|
console.log(app.getVersion())
|
2015-11-12 22:24:11 +08:00
|
|
|
</script>
|
|
|
|
|
</body>
|
2014-05-05 14:49:05 +08:00
|
|
|
</html>
|
|
|
|
|
```
|
|
|
|
|
|
2018-04-09 17:58:10 -03:00
|
|
|
To run your app, read [Run your app](../tutorial/first-app.md#running-your-app).
|
2015-11-12 22:24:11 +08:00
|
|
|
|
|
|
|
|
## Destructuring assignment
|
|
|
|
|
|
2016-05-04 11:59:40 -06:00
|
|
|
As of 0.37, you can use
|
2016-03-05 23:28:39 -08:00
|
|
|
[destructuring assignment][destructuring-assignment] to make it easier to use
|
2016-05-04 11:59:40 -06:00
|
|
|
built-in modules.
|
|
|
|
|
|
|
|
|
|
```javascript
|
2016-07-25 18:39:25 -07:00
|
|
|
const {app, BrowserWindow} = require('electron')
|
|
|
|
|
|
|
|
|
|
let win
|
|
|
|
|
|
|
|
|
|
app.on('ready', () => {
|
|
|
|
|
win = new BrowserWindow()
|
|
|
|
|
win.loadURL('https://github.com')
|
|
|
|
|
})
|
2016-05-04 11:59:40 -06:00
|
|
|
```
|
|
|
|
|
|
|
|
|
|
If you need the entire `electron` module, you can require it and then using
|
|
|
|
|
destructuring to access the individual modules from `electron`.
|
2015-11-12 22:24:11 +08:00
|
|
|
|
|
|
|
|
```javascript
|
2016-07-25 18:39:25 -07:00
|
|
|
const electron = require('electron')
|
|
|
|
|
const {app, BrowserWindow} = electron
|
|
|
|
|
|
|
|
|
|
let win
|
|
|
|
|
|
|
|
|
|
app.on('ready', () => {
|
|
|
|
|
win = new BrowserWindow()
|
|
|
|
|
win.loadURL('https://github.com')
|
|
|
|
|
})
|
2015-11-12 22:24:11 +08:00
|
|
|
```
|
|
|
|
|
|
2016-05-04 11:59:40 -06:00
|
|
|
This is equivalent to the following code:
|
|
|
|
|
|
|
|
|
|
```javascript
|
2016-07-25 18:39:25 -07:00
|
|
|
const electron = require('electron')
|
|
|
|
|
const app = electron.app
|
|
|
|
|
const BrowserWindow = electron.BrowserWindow
|
|
|
|
|
let win
|
|
|
|
|
|
|
|
|
|
app.on('ready', () => {
|
|
|
|
|
win = new BrowserWindow()
|
|
|
|
|
win.loadURL('https://github.com')
|
|
|
|
|
})
|
2016-05-04 11:59:40 -06:00
|
|
|
```
|
2015-11-12 22:24:11 +08:00
|
|
|
|
|
|
|
|
[gui]: https://en.wikipedia.org/wiki/Graphical_user_interface
|
2016-03-05 23:28:39 -08:00
|
|
|
[destructuring-assignment]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment
|
