Summary of the problem of electronic-builder packaging vue2 project

1. The ecmentui icon does not display after packaging

1. Version

• vue ^2.6.14
• element-ui ^2.15.14
• vue-cli-plugin-electron-builder 2.1.1

2. Solution

1) If it is a simple icon, you can use an image instead (this icon will not be displayed for the elementui component)
2) In configuration

const { defineConfig } = require('@vue/cli-service')
 = defineConfig({
  transpileDependencies: true,
  lintOnSave:false,
  pluginOptions:{
    electronBuilder:{
      customFileProtocol:"/"
    }
  }
})

2. Modify the packaged app icon

1. Place the picture under the public folder
2、npm install electron-icon-builder
3. Modify the file (It's strange that you can only use png files but not .ico files here)
“electron:generate-icons”:“electron-icon-builder --input=./public/ --output=build --flatten”
4. Modify

  const win = new BrowserWindow({
    width: 800,
    height: 600,
    icon:'./public/'
    })

5. Modify the file

  pluginOptions:{
    electronBuilder:{
      customFileProtocol:"/",
      win:{
         icon:""
      },
      nodeIntegration: true
    }
  }

6. Pack npm run electron:generate-icons and then npm run electron:build

This is the end of this article about the collection of electronic-builder package vue2 project problems. For more related electronic-builder package vue2 project content, please search for my previous articles or continue browsing the related articles below. I hope everyone will support me in the future!