无法覆盖 mac os 电子菜单上的应用程序名称 [英] Unable to override app name on mac os electron menu

问题描述

我正用头撞墙.我正在尝试覆盖演示电子应用程序的名称，以为其提供自定义名称，而不仅仅是 Electron.我为此创建了一个模块:

const {app, Menu} = require('electron')常量模板 = [{标签:'新名称'，子菜单:[{标签:'测试'，点击:(菜单项，浏览器窗口，事件)=>{console.log('菜单项被点击')}},{角色:'退出'}]},{标签:'测试测试'，子菜单:[{标签:'测试'，点击:(菜单项，浏览器窗口，事件)=>{console.log('菜单项被点击')}},{角色:'退出'}]}]installApplicationMenu = 函数(){const menu = Menu.buildFromTemplate(template)让结果 = Menu.setApplicationMenu(menu)}模块.exports = {安装应用程序菜单}

我在创建窗口后调用这个模块:

const {app, BrowserWindow} = require('electron')常量路径 = 要求('路径')常量 url = 要求('url')const {installApplicationMenu} = 要求('./MenuInstaller')需要('电子重载')(__dirname，{电子:path.join(__dirname，'node_modules'，'.bin'，'electron')})让我们赢函数创建窗口(){赢=新浏览器窗口({宽度:800，身高:600})win.loadURL(网址格式({路径名:path.join(__dirname, 'index.html'),协议:'文件:'，斜线:真}))win.on('关闭', () => {赢=空})}app.on('准备好了', function (){创建窗口()安装应用程序菜单()})app.on('激活', () => {if(win === null) createWindow()})

当我这样做时，第二个菜单集的自定义名称是 test test 但主菜单名称仍然是 Electron:

我一直在将代码与我创建的另一个应用程序进行比较，在该应用程序中我能够覆盖默认名称，但我无法发现在这种情况下是什么阻止了覆盖工作.

有什么想法吗?

解决方案

当你在开发环境中运行你的应用程序时使用;

./node_modules/.bin/electron main.js

或

电子 main.js

您实际上正在运行一个 prebuilt electron 可执行文件，该可执行文件运行您指定的文件.因此在这种情况下，操作系统将显示构建和打包应用程序的名称.

如果你想改变它，你需要打包它.即构建您自己的可分发包.为此，有一个很棒的包 electron-builder

所以安装它；

npm install --save-dev electron-builder

然后构建包；

./node_modules/.bin/build -m

<块引用>

不要忘记在 package.json 中设置 productName.例如，它将显示在 macOS 的菜单中.

-m 适用于 macOS.

您会在 /dist 目录中看到包.但是，如果您有自定义应用程序格式，则可能无法构建，因此请参阅 README 或 wiki 了解有关应用程序结构的详细信息.

I'm banging my head against the wall on this one. I'm trying to override the name of a demo electron app to give it a custom name instead of just Electron. I created a module for doing this:

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

const template = [
    {
        label: 'New Name',
        submenu:[
            {
                label: 'Test',
                click: (menuItem, browserWindow, event) => {
                    console.log('menu item clicked')
                }
            },
            {role: 'quit'}
        ]
    },
    {
        label: 'test test',
        submenu:[
            {
                label: 'Test',
                click: (menuItem, browserWindow, event) => {
                    console.log('menu item clicked')
                }
            },
            {role: 'quit'}
        ]
    }
]

installApplicationMenu = function (){
    const menu = Menu.buildFromTemplate(template)
    let result = Menu.setApplicationMenu(menu)
}


module.exports = {
    installApplicationMenu
}

And I'm invoking this module after creating my window:

const {app, BrowserWindow} = require('electron')
const path = require('path')
const url = require('url')

const {installApplicationMenu} = require('./MenuInstaller')


require('electron-reload')(__dirname,{
    electron: path.join(__dirname, 'node_modules', '.bin', 'electron')
})

let win


function createWindow(){
    win = new BrowserWindow({
        width: 800,
        height: 600
    })

    win.loadURL(
        url.format({
            pathname: path.join(__dirname, 'index.html'),
            protocol: 'file:',
            slashes: true
        })
    )

    win.on('closed', () => {
        win = null
    })

}

app.on('ready', function (){
    createWindow()
    installApplicationMenu()
})


app.on('activate', () => {
    if(win === null) createWindow()
})

When I do this the second menu set gets it's custom name of test test but the main menu name is still Electron:

I've been comparing the code to a different app I created where I was able to override the default name and I can't spot what's keeping the override from working in this case.

Any ideas?

解决方案

When you run your application in development environment using;

./node_modules/.bin/electron main.js

or

electron main.js

You are actually running a prebuilt electron executable that runs file specified by you. So in this case, the OS will display the name under which the application was built and packaged.

If you wish to change it, you need to package it. i.e. build your own distributable package. And to do this, there is an awesome package electron-builder

So install it;

npm install --save-dev electron-builder

And then build the package;

./node_modules/.bin/build -m

Don't forget to set productName in package.json. It will be displyed in the menu on macOS, for example.

-m is for macOS.

And you'll see packages in /dist directory. However, If you have a custom application format, it may fail to build, so refer to README or wiki for details about application structure.

这篇关于无法覆盖 mac os 电子菜单上的应用程序名称的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！