aboutsummaryrefslogtreecommitdiff
path: root/_posts/2019-08-15-electron-reload.md
diff options
context:
space:
mode:
authorValentin Popov <valentin@popov.link>2024-02-14 02:53:22 +0300
committerValentin Popov <valentin@popov.link>2024-02-14 02:53:22 +0300
commitbccf23ae8be7b1b44be223d22d74548f35a489e2 (patch)
tree3c1db568e7d8da56354a9376f2d73fba9c2a9304 /_posts/2019-08-15-electron-reload.md
parente68f7cf6c7fadb1bceea955a4caf40954d9b024e (diff)
downloadpopov.link-bccf23ae8be7b1b44be223d22d74548f35a489e2.tar.xz
popov.link-bccf23ae8be7b1b44be223d22d74548f35a489e2.zip
Moved all posts
Diffstat (limited to '_posts/2019-08-15-electron-reload.md')
-rw-r--r--_posts/2019-08-15-electron-reload.md48
1 files changed, 25 insertions, 23 deletions
diff --git a/_posts/2019-08-15-electron-reload.md b/_posts/2019-08-15-electron-reload.md
index 78ac36b..89e5097 100644
--- a/_posts/2019-08-15-electron-reload.md
+++ b/_posts/2019-08-15-electron-reload.md
@@ -1,16 +1,16 @@
---
-description: "Способы и варианты горячей перезагрузки ElectronJS приложения."
-title: "Перезагрузка ElectronJS приложения"
+description: >-
+ Руководство по автоматической перезагрузке приложений на Electron с помощью пакетов electron-reload и electron-webpack. Обход проблем с совместимостью и использование HMR для renderer процесса.
+title: Горячая перезагрузка ElectronJS приложения
layout: post
---
## Main процесс
-Для перезагрузки основного процесса можно использовать готовый пакет [electron-reload].
-Или перезагружать приложение средствами пакета [electron-webpack].
+Для перезагрузки основного процесса можно использовать готовый пакет [electron-reload]. Или перезагружать приложение средствами пакета [electron-webpack].
-Если сборщик кода отличный от WebPack или нет возможности использовать вышеуказанные пакеты, можно обойтись инструментом [nodemon].
-Команда запуска будет выглядеть следующим образом:
+Если сборщик кода отличный от WebPack или нет возможности использовать вышеуказанные пакеты, можно обойтись инструментом [nodemon]. Команда запуска будет
+выглядеть следующим образом:
```bash
nodemon --watch ./assets/main.js --exec 'electron .'
@@ -20,14 +20,12 @@ nodemon --watch ./assets/main.js --exec 'electron .'
## Renderer процесс
-Для обновления renderer процесса, перезагружать полностью приложение нет необходимости.
-Достаточно обновить страницу.
-Самый простой способ, горячие клавиши: `Ctrl` + `F5`.
-Так как рендер процесс по своей сути является обычным окном браузера, можно настроить [HMR] технологию.
-Конечно, если используются соответствующие инструменты.
+Для обновления renderer процесса, перезагружать полностью приложение нет необходимости. Достаточно обновить страницу. Самый простой способ, горячие
+клавиши: `Ctrl` + `F5`. Так как рендер процесс по своей сути является обычным окном браузера, можно настроить [HMR] технологию. Конечно, если используются
+соответствующие инструменты.
-Мне симпатичен способ использования пакета [electron-reload].
-В алгоритме пакета лежит простое слежение за каталогом файлов и обновление активных окон приложения.
+Мне симпатичен способ использования пакета [electron-reload]. В алгоритме пакета лежит простое слежение за каталогом файлов и обновление активных окон
+приложения.
Но мною была найдена досадная [проблема], не позволяющая использовать версии `1.5.0` и `1.4.1` со сборщиком WebPack, который используется в проекте.
@@ -40,27 +38,31 @@ import chokidar from 'chokidar';
const browserWindows = [];
app.on('browser-window-created', (event, window) => {
- browserWindows.push(window);
+ browserWindows.push(window);
- window.on('closed', () => {
- const index = browserWindows.indexOf(window);
- browserWindows.splice(index, 1);
- });
+ window.on('closed', () => {
+ const index = browserWindows.indexOf(window);
+ browserWindows.splice(index, 1);
+ });
});
if (process.env.NODE_ENV !== 'production') {
- const watcher = chokidar.watch(__dirname, { ignored: [/node_modules|[/\\]\./] });
+ const watcher = chokidar.watch(__dirname, { ignored: [/node_modules|[/\\]\./] });
- watcher.on('change', () => {
- browserWindows.forEach(window => {
- window.webContents.reloadIgnoringCache();
+ watcher.on('change', () => {
+ browserWindows.forEach(window => {
+ window.webContents.reloadIgnoringCache();
+ });
});
- });
}
```
[HMR]: https://webpack.js.org/concepts/hot-module-replacement/
+
[electron-reload]: https://www.npmjs.com/package/electron-reload
+
[electron-webpack]: https://www.npmjs.com/package/electron-webpack
+
[nodemon]: https://www.npmjs.com/package/nodemon
+
[проблема]: https://github.com/yan-foto/electron-reload/issues/66