electron/docs/api/synopsis.md

94 lines
2.4 KiB
Markdown
Raw Normal View History

2014-05-05 06:49:05 +00:00
# Synopsis
2016-04-22 17:30:49 +00:00
> How to use Node.js and Electron APIs.
All of [Node.js's built-in modules](https://nodejs.org/api/) are available in
2015-08-29 05:46:31 +00: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 06:49:05 +00:00
2015-04-16 03:31:12 +00:00
Electron also provides some extra built-in modules for developing native
2015-09-04 20:44:40 +00:00
desktop applications. Some modules are only available in the main process, some
2015-09-01 22:42:10 +00:00
are only available in the renderer process (web page), and some can be used in
either process type.
2015-08-29 05:46:31 +00:00
2015-11-12 14:24:11 +00: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
the concept of main process vs. renderer process
scripts to be able to use those modules.
2014-05-05 06:49:05 +00:00
The main process script is like a normal Node.js script:
2014-05-05 06:49:05 +00:00
```javascript
2018-09-13 16:10:51 +00:00
const { app, BrowserWindow } = require('electron')
let win = null
2014-05-05 06:49:05 +00:00
app.whenReady().then(() => {
2018-09-13 16:10:51 +00:00
win = new BrowserWindow({ width: 800, height: 600 })
win.loadURL('https://github.com')
})
2014-05-05 06:49:05 +00:00
```
2015-11-12 14:24:11 +00:00
The renderer process is no different than a normal web page, except for the
extra ability to use node modules if `nodeIntegration` is enabled:
2014-05-05 06:49:05 +00:00
```html
<!DOCTYPE html>
<html>
2015-11-12 14:24:11 +00:00
<body>
<script>
const fs = require('fs')
console.log(fs.readFileSync(__filename, 'utf8'))
2015-11-12 14:24:11 +00:00
</script>
</body>
2014-05-05 06:49:05 +00:00
</html>
```
2015-11-12 14:24:11 +00:00
## Destructuring assignment
As of 0.37, you can use
2016-03-06 07:28:39 +00:00
[destructuring assignment][destructuring-assignment] to make it easier to use
built-in modules.
```javascript
2018-09-13 16:10:51 +00:00
const { app, BrowserWindow } = require('electron')
let win
app.whenReady().then(() => {
win = new BrowserWindow()
win.loadURL('https://github.com')
})
```
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 14:24:11 +00:00
```javascript
const electron = require('electron')
2018-09-13 16:10:51 +00:00
const { app, BrowserWindow } = electron
let win
app.whenReady().then(() => {
win = new BrowserWindow()
win.loadURL('https://github.com')
})
2015-11-12 14:24:11 +00:00
```
This is equivalent to the following code:
```javascript
const electron = require('electron')
const app = electron.app
const BrowserWindow = electron.BrowserWindow
let win
app.whenReady().then(() => {
win = new BrowserWindow()
win.loadURL('https://github.com')
})
```
2015-11-12 14:24:11 +00:00
[gui]: https://en.wikipedia.org/wiki/Graphical_user_interface
2016-03-06 07:28:39 +00:00
[destructuring-assignment]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment