Требования
Electron - это фреймворк для разработки десктопных приложений с использованием HTML, CSS и JavaScript. Встраивая Chromium и Node.js в свой исполняемый файл, Electron позволяет создавать кросс-платформенные приложения для Windows, macOS и Linux используя единую кодовую базу JavaScript.
В этом руководстве вы узнаете, как разработать настольное приложение с помощью Electron и распространить его конечным пользователям.
Цели
В этом руководстве мы рассмотрим все этапы создания базового приложения Electron с нуля, а затем научим вас собирать и распространять его среди пользователей с помощью Electron Forge.
Если вы предпочитаете создавать проект с помощью одной команды, мы рекомендуем начать с команды Electron Forge create-electron-app.
Предпосылки
Electron является нативной оболочкой для веб-приложений и исполняется в среде Node.js. Поэтому в данном руководстве предполагается, что вы в общих чертах знакомы с Node и основами front-end веб-разработки. Если вам необходимо получить дополнительную информацию, прежде чем продолжить, мы рекомендуем воспользоваться следующими ресурсами:
Необходимые инструменты
Редактор кода
Вам понадобится текстовый редактор, чтобы писать код. Мы рекомендуем использовать Visual Studio Code, но вы можете выбрать любой из тех, что вы предпочитаете.
Командная строка
На протяжении руководства мы будем просить вас использовать различные командные интерфейсы (CLI). Эти команды можно вводить в стандартном терминале системы:
- Windows: Командная строка или PowerShell
- macOS: Terminal
- Linux: зависит от дистрибутива (например: GNOME Terminal, Konsole)
Большинство редакторов имеют встроенный терминал, который вы также можете использовать.
Git и GitHub
Git - это наиболее распространенная система контроля версий исходного кода, а GitHub - платформа для совместной разработки, построенная на ее основе. Хотя ни то, ни другое не является строго необходимым для создания приложения Electron, далее в руководстве, мы будем использовать GitHub releases для настройки автоматических обновлений. Поэтому от вас потребуется:
Если вы не знакомы с механизмом работы Git, мы рекомендуем ознакомиться с руководствами GitHub по работе с Git. Также можно воспользоваться приложением GitHub Desktop, если вы предпочитаете использовать графический интерфейс, а не командную строку.
Перед началом обучения мы рекомендуем создать локальный Git-репозиторий и разместить его на GitHub, а также делать commit после каждого шага.
GitHub Desktop установит последнюю версию Git в вашей системе, если у вас он ещё не установлен.
Node.js и npm
Для начала разработки приложения Electron необходимо установить Node.js и входящий в ее состав менеджер пакетов npm. Мы рекомендуем использовать последнюю версию с длительной поддержкой (LTS).
Пожалуйста, установите Node.js с помощью предварительно собранных установщиков для вашей платформы. В противном случае могут возникнуть проблемы совместимости. Если вы используете macOS, мы рекомендуем воспользоваться менеджером пакетов, например Homebrew или nvm чтобы избежать проблем с правами доступа к каталогам.
Чтобы проверить, что Node.js был установлен правильно, используйте флаг -v при выполнении команд node и npm. В результате должны быть отображены их версии.
$ node -v
v16.14.2
$ npm -v
8.7.0
Хотя для создания проекта Electron необходима установленная локально Node.js, Electron не использует Node.js вашей системы для выполнения своего кода. Вместо этого он поставляется в комплекте с собственной средой выполнения Node.js. Таким образом, конечным пользователям не нужно самостоятельно устанавливать Node.js для запуска вашего приложения.
Чтобы проверить, какая версия Node.js запущена в вашем приложении, вы можете обратиться к глобальной переменной process.versions в основном процессе или скрипте предварительной загрузки (preload). Также можно воспользоваться ссылкой https://releases.electronjs.org/releases.json.