electron-builder打包vue2項(xiàng)目問題總結(jié)

更新時(shí)間：2024年08月03日 10:21:53 作者：不恰香菜辣baga

這篇文章主要介紹了electron-builder打包vue2項(xiàng)目問題總結(jié),本文給大家介紹的非常詳細(xì),對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友參考下吧

一、打包之后不顯示elecmentui的圖標(biāo)

1、使用版本

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

2、解決辦法

1）如果是簡單的圖標(biāo)可以使用圖片代替（這種對于elementui組件的圖標(biāo)還是不會(huì)顯示）
2）在vue.config.js配置

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

二、修改打包之后的app圖標(biāo)

1、將圖片放在public文件夾下面
2、npm install electron-icon-builder
3、修改package.json文件(很奇怪這里只能用png文件不能使用.ico文件)
“electron:generate-icons”:“electron-icon-builder --input=./public/logo.png --output=build --flatten”
4、修改background.js

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

5、修改vue.config.js文件

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

6、打包 npm run electron:generate-icons 然后再 npm run electron:build

到此這篇關(guān)于electron-builder打包vue2項(xiàng)目問題合集的文章就介紹到這了,更多相關(guān)electron-builder打包vue2項(xiàng)目內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章:

相關(guān)文章

使用Vue+MySQL實(shí)現(xiàn)登錄注冊的實(shí)戰(zhàn)案例
第一次用Vue+MySQL實(shí)現(xiàn)注冊登錄功能,就已經(jīng)踩了很多坑,下面這篇文章主要給大家介紹了關(guān)于使用Vue+MySQL實(shí)現(xiàn)登錄注冊案例的相關(guān)資料,需要的朋友可以參考下
2022-05-05
vue.js父子組件通信動(dòng)態(tài)綁定的實(shí)例
今天小編就為大家分享一篇vue.js父子組件通信動(dòng)態(tài)綁定的實(shí)例，具有很好的參考價(jià)值，希望對大家有所幫助。一起跟隨小編過來看看吧
2018-09-09
vue中怎樣讓函數(shù)只執(zhí)行一次
這篇文章主要介紹了vue中怎樣讓函數(shù)只執(zhí)行一次問題，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-03-03
vue請求數(shù)據(jù)的三種方式
這篇文章主要介紹了vue請求數(shù)據(jù)的三種方式,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2020-03-03
vue選項(xiàng)卡組件的實(shí)現(xiàn)方法
這篇文章主要為大家詳細(xì)介紹了vue選項(xiàng)卡組件的實(shí)現(xiàn)方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-03-03
vue-socket.io接收不到數(shù)據(jù)問題的解決方法
這篇文章主要介紹了解決vue-socket.io接收不到數(shù)據(jù)問題的解決方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2020-05-05
vue-cli中devServer.proxy相關(guān)配置項(xiàng)的使用
這篇文章主要介紹了vue-cli中devServer.proxy相關(guān)配置項(xiàng)的使用詳解，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-04-04
Element實(shí)現(xiàn)登錄+注冊的示例代碼
登錄注冊是最常用的網(wǎng)站功能,本文主要介紹了Element實(shí)現(xiàn)登錄+注冊的示例代碼,具有一定的參考價(jià)值,感興趣的可以了解一下
2023-09-09
vue常見路由跳轉(zhuǎn)的幾種方式小結(jié)
本文主要介紹了常見路由跳轉(zhuǎn)的幾種方式，主要介紹了四種常見方式，具有一定的參考價(jià)值，感興趣的可以了解一下
2023-09-09
Vue實(shí)現(xiàn)可復(fù)用輪播組件的方法
這篇文章主要為大家詳細(xì)介紹了Vue實(shí)現(xiàn)可復(fù)用輪播組件的方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-07-07