You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Electron-Vite项目Windows端自定义应用图标不生效问题排查

Electron-Vite项目Windows自定义图标不生效问题

使用Electron-Vite创建项目,配置自定义图标后执行npm run build:win生成dist文件夹,但最终应用图标与build目录下的icon.ico不一致,查阅多篇相关帖子仍未解决。

项目文件夹结构:
项目文件夹结构

electron-builder.yml配置

appId: com.notable.app
productName: Notable
directories:
  buildResources: build
files:
  - '!**/.vscode/*'
  - '!src/*'
  - '!electron.vite.config.{js,ts,mjs,cjs}'
  - '!{.eslintcache,eslint.config.mjs,.prettierignore,.prettierrc.yaml,dev-app-update.yml,CHANGELOG.md,README.md}'
  - '!{.env,.env.*,.npmrc,pnpm-lock.yaml}'
  - '!{tsconfig.json,tsconfig.node.json,tsconfig.web.json}'
asarUnpack:
  - resources/**
win:
  target:
    - target: nsis
      arch:
        - x64
  icon: 'build/icon.ico'
nsis:
  oneClick: false
  artifactName: ${name}-${version}-setup.${ext}
  shortcutName: Notable
  uninstallDisplayName: Notable
  createDesktopShortcut: always
  installerIcon: 'build/icon.ico'
  uninstallerIcon: 'build/icon.ico'
  installerHeaderIcon: 'build/icon.ico'
  allowToChangeInstallationDirectory: true
mac:
  entitlementsInherit: build/entitlements.mac.plist
  extendInfo:
    - NSCameraUsageDescription: Application requests access to the device's camera.
    - NSMicrophoneUsageDescription: Application requests access to the device's microphone.
    - NSDocumentsFolderUsageDescription: Application requests access to the user's Documents folder.
    - NSDownloadsFolderUsageDescription: Application requests access to the user's Downloads folder.
  notarize: false
  icon: build/icon
dmg:
  artifactName: ${name}-${version}.${ext}
linux:
  target:
    - AppImage
    - snap
    - deb
  maintainer: electronjs.org
  category: Utility
  icon: build/icon
appImage:
  artifactName: ${name}-${version}.${ext}
npmRebuild: false
publish:
  provider: generic
  url: https://example.com/auto-updates

package.json配置

{
  "name": "notable",
  "version": "1.0.0",
  "description": "An Electron application with React and TypeScript as a markdown editor",
  "main": "./out/main/index.js",
  "author": "Cody-Kao",
  "homepage": "https://electron-vite.org",
  "scripts": {
    "format": "prettier --write .",
    "lint": "eslint --cache .",
    "typecheck:node": "tsc --noEmit -p tsconfig.node.json --composite false",
    "typecheck:web": "tsc --noEmit -p tsconfig.web.json --composite false",
    "typecheck": "npm run typecheck:node && npm run typecheck:web",
    "start": "electron-vite preview",
    "dev": "electron-vite dev",
    "build": "npm run typecheck && electron-vite build",
    "postinstall": "electron-builder install-app-deps",
    "build:unpack": "npm run build && electron-builder --dir",
    "build:win": "npm run build && electron-builder --win",
    "build:mac": "electron-vite build && electron-builder --mac",
    "build:linux": "electron-vite build && electron-builder --linux"
  },
  "dependencies": {
    "@electron-toolkit/preload": "^3.0.1",
    "@electron-toolkit/utils": "^4.0.0",
    "@mdxeditor/editor": "^3.32.1",
    "fs-extra": "^11.3.0",
    "jotai": "^2.12.3",
    "loadash": "^1.0.0",
    "lodash": "^4.17.21",
    "react-error-boundary": "^6.0.0",
    "react-icons": "^5.5.0",
    "remove-markdown": "^0.6.2",
    "uuid": "^11.1.0"
  },
  "devDependencies": {
    "@electron-toolkit/eslint-config-prettier": "^3.0.0",
    "@electron-toolkit/eslint-config-ts": "^3.0.0",
    "@electron-toolkit/tsconfig": "^1.0.1",
    "@tailwindcss/postcss": "^4.1.5",
    "@tailwindcss/typography": "^0.5.16",
    "@types/node": "^22.14.1",
    "@types/react": "^19.1.1",
    "@types/react-dom": "^19.1.2",
    "@vitejs/plugin-react": "^4.3.4",
    "autoprefixer": "^10.4.21",
    "clsx": "^2.1.1",
    "electron": "^35.1.5",
    "electron-builder": "^25.1.8",
    "electron-vite": "^3.1.0",
    "eslint": "^9.24.0",
    "eslint-plugin-react": "^7.37.5",
    "eslint-plugin-react-hooks": "^5.2.0",
    "eslint-plugin-react-refresh": "^0.4.19",
    "postcss": "^8.5.3",
    "prettier-plugin-tailwindcss": "^0.6.11",
    "react": "^19.1.0",
    "react-dom": "^19.1.0",
    "tailwind-merge": "^3.2.0",
    "tailwindcss": "^4.1.5",
    "typescript": "^5.8.3",
    "vite": "^6.2.6"
  }
}

构建后生成的应用图标:
构建后应用图标

请问是配置存在问题,还是图标缓存导致的?如需更多配置或文件夹结构细节,请告知!

内容的提问来源于stack exchange,提问作者Cody Gao

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.06.13 04:24:53