импорт меню в окно браузера с помощью функции "require"

#javascript #node.js #electron #commonjs

#javascript #node.js #электрон #общие правила #electron #commonjs

Вопрос:

Я работаю над демонстрацией electron, следуя этому руководству.

просто интересно, что произошло в требуемой строке кода.

./menu/mainmenu.js определяет пункты меню.

 const {Menu} = require('electron')
const electron = require('electron')
const app = electron.app

const template = [
  {
    label: 'Edit',
    submenu: [
      {
        role: 'undo'
      },
      {
        role: 'redo'
      },
      {
        type: 'separator'
      },
      {
        role: 'cut'
      },
      {
        role: 'copy'
      },
      {
        role: 'paste'
      },
      {
        role: 'pasteandmatchstyle'
      },
      {
        role: 'delete'
      },
      {
        role: 'selectall'
      }
    ]
  }
]

const menu = Menu.buildFromTemplate(template)
Menu.setApplicationMenu(menu)

main.js

 const { app, BrowserWindow, ipcMain } = require('electron');
let win;

function createWindow () {
  win = new BrowserWindow({
    width: 880,
    height: 660,
    webPreferences: {
      nodeIntegration: true
    }
  })
  // and load the index.html of the app.
  win.loadFile('index.html')

  require('./menu/mainmenu') //does this line copied the whole mainmenu.js file?
}

require('./menu/mainmenu') копирует ли весь файл в main.js ?

Или импортировал некоторые модули? В mainmenu.js файл Там нет export ключевого слова.

в соответствии с node.js документация,

«Основная функциональность require заключается в том, что он считывает файл JavaScript, выполняет файл, а затем переходит к возврату объекта экспорта».

1. require здесь не копирует файл (в отличие c от #include)

2. чтобы объяснить, что require должен выполнять этот файл (на который имхо никогда не следует полагаться)

3. @appleapple есть предложения, почему никогда не следует полагаться на метод?

Ответ №1:

require здесь не копируется файл (в отличие c от #include)

Вместо этого он запускает файл и возвращает экспортированные элементы (если таковые имеются)

Поскольку export './menu/mainmenu' при вызове нет in require , он просто выполнил этот файл.

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

пример:

./menu/mainmenu.js

 //...
const menu = Menu.buildFromTemplate(template)
export default ()=>Menu.setApplicationMenu(menu)

main.js

 const { app, BrowserWindow, ipcMain } = require('electron');

let win;

function createWindow () {
  //...

  const setmenu = require('./menu/mainmenu') // you can put this at top, too
  setmenu();

  // or you can execute it inline
  // require('./menu/mainmenu')()
}

примечание: вам может понадобиться https://www.npmjs.com/package/babel-plugin-add-module-exports или какой-то обходной путь, который нужно сделать require и default export который работает вместе.

* проблема в том, что вы не можете полагаться на то, что оно будет работать каждый раз, например. измените меню с A -> B -> A, второе require('A') ничего не сделает.