Установка Electron

В состав установленных компонентов входит программа NPM (Node Package Manager, менеджер пакетов Node.js), позволяющая устанавливать различные утилиты и управлять приложением. Давайте проверим ее работоспособность, путем вывода версии:

C:\book>npm --version
6.14.6

Можно также воспользоваться командой npm -v:

C:\book\p1>npm -v
6.14.6

Давайте в каталоге C:\book создадим полноценный пакет Node.js под названием e1 (сокращение от electron1, чтобы команды были короче). В Проводнике Windows создаем каталог e1, а затем перетаскиваем его в окно редактора Visual Studio Code, чтобы открыть каталог. Все дальнейшие действия по созданию файлов и каталогов производим на панели Проводник. Внутри каталога C:\book\e1 создаем файл с названием main.js в кодировке UTF-8.

Чтобы превратить каталог C:\book\e1 в полноценный пакет, нужно создать в нем файл с названием package.json. Для этого открываем командную строку и переходим в каталог пакета:

C:\book>cd C:\book\e1
C:\book\e1>

Обратите внимание: название каталога должно быть в составе приглашения для ввода команды. Если путь будет другим, то файл будет создан в другом каталоге. Для создания файла package.json выполняем команду npm init -y:

C:\book\e1>npm init -y
Wrote to C:\book\e1\package.json:
{
  "name": "e1",
  "version": "1.0.0",
  "description": "",
  "main": "main.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],
  "author": "",
  "license": "MIT"
}

После выполнения команды было выведено содержимое созданного файла. В данной команде мы указали флаг -y. Если флаг не указать, то программа будет запрашивать данные прямо в командной строке. Можно ввести данные, а можно на каждый запрос нажимать клавишу <Enter>. В конце диалога нужно подтвердить создание файла.

Теперь установим Electron как зависимость для нашего пакета:

C:\book\e1>npm install electron --save-dev

В результате будет создан каталог node_modules со всеми необходимыми пакетами, а в файл package.json будут добавлены следующие строки:

"devDependencies": {
  "electron": "^12.0.5"
}

Отредактируем раздел scripts следующим образом:

"scripts": {
  "start": "electron ."
}

Теперь мы можем запустить приложение с помощью команды:

npm run start

Но предварительно нужно создать все необходимые файлы приложения.