Dock (macOS)

    The custom dock is commonly used to add shortcuts to tasks the user wouldn’t want to open the whole app window for.

    Dock menu of Terminal.app:

    To set your custom dock menu, you need to use the app.dock.setMenu API, which is only available on macOS.

    Starting with a working application from the , update the file with the following lines:

    • index.html
    • main.js
    1. const { app, BrowserWindow, Menu } = require('electron')
    3. function createWindow () {
    4.   const win = new BrowserWindow({
    5.     width: 800,
    6.     height: 600,
    7.   })
    9.   win.loadFile('index.html')
    10. }
    12.   {
    14.     click () { console.log('New Window') }
    15.   }, {
    16.     label: 'New Window with Settings',
    17.     submenu: [
    18.       { label: 'Basic' },
    19.       { label: 'Pro' }
    20.     ]
    21.   },
    22.   { label: 'New Command...' }
    23. ])
    25. app.whenReady().then(() => {
    27.   }
    28. }).then(createWindow)
    30. app.on('window-all-closed', () => {
    31.   if (process.platform !== 'darwin') {
    32.     app.quit()
    33.   }
    34. })
    36. app.on('activate', () => {
    37.   if (BrowserWindow.getAllWindows().length === 0) {
    38.     createWindow()
    39.   }

    After launching the Electron application, right click the application icon. You should see the custom menu you just defined: