vue-cli-plugin-electron-builder创建的electron项目打包时怎么自定义图标

只需要在当前项目的根目录下创建一个vue.config.js,代码如下:

module.exports = {
    pluginOptions: {
        electronBuilder: {
            builderOptions: {
                "appId": "com.example.app",
                "productName": "demo", //项目名,也是生成的安装文件名,即demo.exe
                "copyright": "Copyright © 2020", //版权信息
                "directories": {
                    "output": "./dist_electron" //输出文件路径
                },
                "asar": true,
                "dmg": {
                    "contents": [{
                            "x": 410,
                            "y": 150,
                            "type": "link",
                            "path": "/Applications"
                        },
                        {
                            "x": 130,
                            "y": 150,
                            "type": "file"
                        }
                    ]
                },
                "nsis": {
                    "oneClick": false, // 是否一键安装
                    "allowElevation": true, // 允许请求提升。 如果为false,则用户必须使用提升的权限重新启动安装程序。
                    "allowToChangeInstallationDirectory": true, // 允许修改安装目录
                    "installerIcon": "./public/icon.ico", // 安装图标
                    "uninstallerIcon": "./public/icon.ico", //卸载图标
                    "installerHeaderIcon": "./public/icon.ico", // 安装时头部图标
                    "createDesktopShortcut": true, // 创建桌面图标
                    "createStartMenuShortcut": true, // 创建开始菜单图标
                    "shortcutName": "demo", // 图标名称
                },
                "win": { //win相关配置
                    "icon": "./public/icon.ico", //图标,当前图标在根目录下,注意这里有两个坑
                    "target": [{
                        "target": "nsis", //利用nsis制作安装程序
                        "arch": [
                            "x64", //64位
                            "ia32" //32位
                        ]
                    }]
                },
                "mac": {
                    "icon": './public/icon.icns'
                }
            }
        }

    }
}

在public目录下放两个图标icon.ico和icon.icns,icon.ico是windows的图标,icon.icns是mac的图标,这样就可以把默认图标改成自定义的图标了。
配置里还有一些其它信息,可以根据自己的所需修改。

  • 2
  • 3,948 views
    A+
发布日期:2020年09月25日  所属分类:electron

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

目前评论:2   其中:访客  1   博主  1

  1. 果俊宇[2017010656] 0

    好大哥我真的找了好久解决办法了,备受折磨,还好找到了你,万分感谢