angularionic-frameworkelectron

Override first menu item in Electron


The first menu item in Electron app is apparently the app name, but when I try to run my application it always says "Electron", even after explicitly setting the app.name variable in main.js. I want to know if there is a way to change it to a custom name. The solutions I saw involved changing the Info.plist file which will be part of the app module. This doesn't seem like the optimal way to do this.

app.name = 'Custom App Name';

const isMac = process.platform === 'darwin'

const mainMenuTemplate = [
    ...(isMac ? [{
        label: app.name,
        submenu: [
            { role: 'about' },
            { type: 'separator' },
            { role: 'hide' },
            { role: 'hideOthers' },
            { role: 'unhide' },
            { type: 'separator' },
            { role: 'quit' }
        ]
    }] : []),
    {
        label:'File',
        submenu: [
            {
                label: 'More information',
                role: 'info'
            },
         ]
    },
    {
        label:'View',
        submenu: [
            {
               role: 'reload'
            },
        ]
    }
];

// Create the application menu
const menu = Menu.buildFromTemplate(mainMenuTemplate)
Menu.setApplicationMenu(menu)

Application Screenshot


Solution

  • The app name has to be set with the field(s) name and/or productName of the package.json. From app.getName() method:

    Usually the name field of package.json is a short lowercase name, according to the npm modules spec. You should usually also specify a productName field, which is your application's full capitalized name, and which will be preferred over name by Electron.

    Additionnaly, if you want to change the name dynamically, you have to use the setter app.setName():

    app.setName("New name");