Vite+Electron应用Cache put报错，如何在vite.config.ts禁用Service Worker？

这个错误是因为Electron使用app://协议加载资源，而Service Worker的Cache API仅支持HTTP/HTTPS协议，禁用Service Worker即可解决问题，具体操作如下：

1. 禁用Vite PWA插件（若已使用） #

如果你的项目依赖@vitejs/plugin-pwa插件，直接在配置里关闭它：
打开vite.config.ts，找到插件配置段修改：

import { defineConfig } from 'vite'
import { VitePWA } from '@vitejs/plugin-pwa'

export default defineConfig({
  plugins: [
    // 其他项目插件
    VitePWA({ disable: true }) // 禁用PWA插件，同时关闭Service Worker功能
  ]
})

也可以直接移除VitePWA的引入和配置代码。

2. 关闭Vite自动生成Service Worker #

若未使用PWA插件，但Vite存在自动生成Service Worker的配置，在build选项中禁用：

export default defineConfig({
  build: {
    serviceWorker: false // 禁止Vite自动生成Service Worker相关文件
  }
})

3. 注释掉项目中的Service Worker注册代码 #

检查项目入口文件（如main.ts、index.ts），找到Service Worker的注册代码并注释：

// 注释掉这段注册逻辑
// if ('serviceWorker' in navigator) {
//   navigator.serviceWorker.register('/sw.js')
//     .then(reg => console.log('Service Worker registered'))
//     .catch(err => console.error('Service Worker registration failed:', err))
// }

完成以上操作后，重新构建并运行Electron应用，该报错即可消失。

内容的提问来源于stack exchange，提问作者David Murasov