В этом руководстве предполагается, что вы знаете, как установить и настроить проект electron-quick-start. Вы можете найти учебник здесь.

Модуль оболочки в Electron позволяет вам получить доступ к некоторым встроенным элементам, таким как файловый менеджер и веб-браузер по умолчанию.

Мы можем загрузить модуль оболочки, создав новую постоянную shell и запросив electron.shell.

const shell = require(‘electron’).shell

Мы также загрузим модуль ОС и назначим его константе ОС. Мы используем этот модуль для получения домашнего каталога пользователя.

const os = require(‘os’)

Начните с добавления кнопки с идентификатором open-file-manager в файл index.html в конце тега body. Текст кнопки должен быть «Открыть файловый менеджер». Мы предоставляем идентификатор, потому что мы будем использовать его для ссылки на элемент в файле JavaScript.

<button id=”open-file-manager”>Open file manager</button>

Отлично, теперь давайте воспользуемся нашим идентификатором из кнопки и определим const fileManagerBtn. Мы можем получить ссылку на элемент, используя document.getElementById и указав идентификатор нашей кнопки.

const fileManagerBtn = document.getElementById(‘open-file-manager’)

И последнее, что нам нужно сделать, это определить новый прослушиватель событий щелчка. Сделайте это, вызвав fileManagerBtn.addEventListener и передав 'click' в качестве параметра и анонимную функцию с параметром события.

Внутри функция вызовет shell.showItemInFolder и передаст наш os.homedir() в качестве параметра. Это откроет файловый менеджер и отобразит все элементы в нашем домашнем каталоге.

fileManagerBtn.addEventListener(‘click’, function (event) {
   shell.showItemInFolder(os.homedir())
})