В этой статье вы узнаете, как выполняется установка Electron Framework на Ubuntu 22.04.
Для тех, кто не знает, Electron — это фреймворк для создания кроссплатформенных настольных приложений с использованием веб-технологий, таких как HTML, CSS и JavaScript. Он основан на двух основных компонентах: Node.js и Chromium. Node.js предоставляет доступ к системным ресурсам, таким как файловая система и сеть, в то время как Chromium используется для рендеринга пользовательского интерфейса приложения.
Electron позволяет разработчикам использовать свои знания веб-технологий для создания настольных приложений, которые могут работать на разных операционных системах, включая Windows, macOS и Linux. Framework также предоставляет API для доступа к ресурсам операционной системы, таким как файловая система, база данных, уведомления и многое другое.
Благодаря своей гибкости и простоте использования, Electron стал популярным инструментом для создания настольных приложений, включая мессенджеры, редакторы кода, музыкальные плееры и многие другие
Поэтому, если вы веб-программист, вы сможете использовать его для создания приложений без особых проблем.
Одним из больших преимуществ использования Electron является его совместимость с операционными системами. Его приложения работают на трех платформах со всеми поддерживаемыми архитектурами.
Установка Electron в Ubuntu 22.04
Как вы можете себе представить, мы должны установить Node.js в качестве начальной зависимости Electron. Они рекомендуют всегда использовать последнюю доступную версию LTS.
И так поехали.
Установка Node.js в Ubuntu 22.04
Сначала откройте терминал и обновите вашу Ubuntu.
sudo apt update
sudo apt upgrade
Далее вы можете загрузить сценарий установки для версии 18, которая является последней доступной версией LTS.
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
Теперь переходим к установке пакета Node.js.
sudo apt install nodejs
Далее требуется проверить версию node и npm.
node -v
v18.16.0
И
npm -v
9.5.1
Теперь все готово для установки Electron.
Установка Electron в Ubuntu
Сначала создайте папку с именем вашего проекта и откройте к ней доступ.
mkdir project && cd project
Затем запустите команду.
npm init
Эта команда задаст вам ряд вопросов о конфигурации. В приложении Electron значения Author и description могут быть любыми, но они необходимы.
Ваш файл package.json будет выглядеть примерно так.
{
«name»: «project»,
«version»: «1.0.0»,
«description»: «Sample for LINUXWIN»,
«main»: «main.js»,
«scripts»: {
«test»: «echo \»Error: no test specified\» && exit 1″
},
«author»: «LINUXWIN»,
«license»: «MIT»
}
Далее требуется установить Electron с его зависимостями, делается это следующей командой.
npm install --save-dev electron
Эта команда запустит процесс установки без каких-либо серьезных задержек.
Отредактируйте файл package.json еще раз и добавьте start
{
"scripts": {
"start": "electron ."
},
}
Сохраните изменения в файле и закройте редактор.
Итак попробуйте ввести данную команду, для того чтобы начать.
npm start
Однако из официальной документации нам сообщают:
Note: This script tells Electron to run in the root folder of your project. At this stage, your application will throw an error saying that it cannot find an application to run.
Это означает, что вы используете сценарий для запуска приложения с использованием Electron и указываете ему, чтобы он запускал приложение из корневой папки вашего проекта. Если вы запустите приложение с помощью этого сценария, но ваше приложение находится в другой папке, то вы получите сообщение об ошибке, говорящее о том, что Electron не может найти файлы для запуска приложения. Чтобы избежать этой ошибки, убедитесь, что ваше приложение находится в корневой папке проекта, или измените путь к файлам в сценарии, чтобы он указывал на правильную папку, в которой находится ваше приложение.
Вот и все Electron установлен, теперь вам остается продолжить проект, создать код в файле main.js и двигаться дальше.
Заключение
Electron — один из самых важных фреймворков на сегодняшний день. Он позволяет нам создавать настольные приложения с использованием веб-технологий.
