🔧 chore: 更新依赖版本，优化 Electron 窗口设置，调整歌词窗口背景色样式

algerkong · algerkong · commit a676136f48c5 · 2025-04-18T19:18:31.000+08:00
diff --git a/package.json b/package.json
@@ -21,20 +21,20 @@
     "build:linux": "npm run build && electron-builder --linux"
   },
   "dependencies": {
-    "@electron-toolkit/preload": "^3.0.0",
-    "@electron-toolkit/utils": "^3.0.0",
+    "@electron-toolkit/preload": "^3.0.1",
+    "@electron-toolkit/utils": "^4.0.0",
     "@unblockneteasemusic/server": "^0.27.8-patch.1",
     "electron-store": "^8.1.0",
-    "electron-updater": "^6.1.7",
+    "electron-updater": "^6.6.2",
     "font-list": "^1.5.1",
     "netease-cloud-music-api-alger": "^4.26.1",
     "node-id3": "^0.2.9",
     "node-machine-id": "^1.1.12",
-    "vue-i18n": "9"
+    "vue-i18n": "^11.1.3"
   },
   "devDependencies": {
-    "@electron-toolkit/eslint-config": "^1.0.2",
-    "@electron-toolkit/eslint-config-ts": "^2.0.0",
+    "@electron-toolkit/eslint-config": "^2.1.0",
+    "@electron-toolkit/eslint-config-ts": "^3.1.0",
     "@electron-toolkit/tsconfig": "^1.0.1",
     "@rushstack/eslint-patch": "^1.10.3",
     "@tailwindcss/postcss7-compat": "^2.2.4",
@@ -48,15 +48,15 @@
     "@vue/eslint-config-prettier": "^9.0.0",
     "@vue/eslint-config-typescript": "^13.0.0",
     "@vue/runtime-core": "^3.5.0",
-    "@vueuse/core": "^11.0.3",
-    "@vueuse/electron": "^11.0.3",
+    "@vueuse/core": "^11.3.0",
+    "@vueuse/electron": "^11.3.0",
     "animate.css": "^4.1.1",
     "autoprefixer": "^10.4.20",
     "axios": "^1.7.7",
     "cross-env": "^7.0.3",
-    "electron": "^35.0.2",
+    "electron": "^35.1.5",
     "electron-builder": "^25.1.8",
-    "electron-vite": "^3.0.0",
+    "electron-vite": "^3.1.0",
     "eslint": "^8.57.0",
     "eslint-config-airbnb-base": "^15.0.0",
     "eslint-config-prettier": "^9.0.0",
diff --git a/src/main/lyric.ts b/src/main/lyric.ts
@@ -84,15 +84,18 @@ const createWin = () => {
     frame: false,
     show: false,
     transparent: true,
+    opacity: 1,
     hasShadow: false,
     alwaysOnTop: true,
     resizable: true,
+    roundedCorners: false,
     // 添加跨屏幕支持选项
     webPreferences: {
       preload: join(__dirname, '../preload/index.js'),
       sandbox: false,
       contextIsolation: true
-    }
+    },
+    backgroundColor: '#00000000'
   });
 
   // 监听窗口关闭事件
diff --git a/src/renderer/views/lyric/index.vue b/src/renderer/views/lyric/index.vue
@@ -172,6 +172,16 @@ const handleMouseLeave = () => {
   if (!lyricSetting.value.isLock) return;
   isHovering.value = false;
   windowData.electron.ipcRenderer.send('set-ignore-mouse', false);
+  
+  // 强制重置背景色
+  const lyricWindow = document.querySelector('.lyric-window') as HTMLElement;
+  if (lyricWindow) {
+    lyricWindow.style.background = 'transparent';
+    // 使用 requestAnimationFrame 确保在下一帧重置
+    requestAnimationFrame(() => {
+      lyricWindow.style.background = 'transparent';
+    });
+  }
 };
 
 // 监听锁定状态变化
@@ -633,8 +643,12 @@ const handleNext = () => {
 </script>
 
 <style scoped>
-body {
+html,
+body,
+#app {
   background-color: transparent !important;
+  box-shadow: none !important;
+  border: none !important;
 }
 </style>
 
@@ -644,14 +658,13 @@ body {
   height: 100vh;
   position: relative;
   overflow: hidden;
-  background: transparent;
+  background: transparent !important;
   user-select: none;
-  transition: background-color 0.2s ease;
+  transition: background-color 0.3s ease;
   cursor: default;
   border-radius: 14px;
 
   &:hover {
-    background: rgba(44, 44, 44, 0.466);
     .control-bar {
       &-show {
         opacity: 1;
@@ -670,7 +683,7 @@ body {
     --highlight-color: #1db954;
     --control-bg: rgba(124, 124, 124, 0.3);
     &:hover {
-      background: rgba(44, 44, 44, 0.466);
+      background: rgba(44, 44, 44, 0.466) !important;
     }
   }
 
@@ -680,7 +693,7 @@ body {
     --highlight-color: #1db954;
     --control-bg: rgba(255, 255, 255, 0.3);
     &:hover {
-      background: rgba(0, 0, 0, 0.434);
+      background: rgba(0, 0, 0, 0.434) !important;
     }
   }
 }
