docs: document type-specific module aliases (#39685)

This commit is contained in:
Erick Zhao 2023-09-27 17:07:04 +02:00 committed by GitHub
parent f943b8c940
commit a0ae691a9c
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 31 additions and 2 deletions

View file

@ -228,6 +228,23 @@ channel with a renderer process using [`MessagePort`][]s. An Electron app can
always prefer the [UtilityProcess][] API over Node.js [`child_process.fork`][] API when
there is need to fork a child process from the main process.
## Process-specific module aliases (TypeScript)
Electron's npm package also exports subpaths that contain a subset of
Electron's TypeScript type definitions.
- `electron/main` includes types for all main process modules.
- `electron/renderer` includes types for all renderer process modules.
- `electron/common` includes types for modules that can run in main and renderer processes.
These aliases have no impact on runtime, but can be used for typechecking
and autocomplete.
```js title="Usage example"
const { app } = require('electron/main')
const { shell } = require('electron/common')
```
[window-mdn]: https://developer.mozilla.org/en-US/docs/Web/API/Window
[`MessagePort`]: https://developer.mozilla.org/en-US/docs/Web/API/MessagePort
[`child_process.fork`]: https://nodejs.org/dist/latest-v16.x/docs/api/child_process.html#child_processforkmodulepath-args-options

View file

@ -222,14 +222,26 @@ with CommonJS module syntax:
- [app][app], which controls your application's event lifecycle.
- [BrowserWindow][browser-window], which creates and manages app windows.
:::info Capitalization conventions
<details><summary>Module capitalization conventions</summary>
You might have noticed the capitalization difference between the **a**pp
and **B**rowser**W**indow modules. Electron follows typical JavaScript conventions here,
where PascalCase modules are instantiable class constructors (e.g. BrowserWindow, Tray,
Notification) whereas camelCase modules are not instantiable (e.g. app, ipcRenderer, webContents).
:::
</details>
<details><summary>Typed import aliases</summary>
For better type checking when writing TypeScript code, you can choose to import
main process modules from <code>electron/main</code>.
```js
const { app, BrowserWindow } = require('electron/main')
```
For more information, see the [Process Model docs](../tutorial/process-model.md#process-specific-module-aliases-typescript).
</details>
:::warning ES Modules in Electron