使用vite-plugin-pwa配置Vue PWA遇问题：未检测到manifest

核心问题排查与修复 #

1. 确保vite-plugin-pwa自动注入Manifest链接 #

vite-plugin-pwa默认会自动在index.html中注入Manifest的<link>标签，不要手动添加，手动添加会导致路径冲突或重复，反而触发Lighthouse错误。检查你的vite.config.js，确保PWA配置中manifest字段完整且正确：

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

export default defineConfig({
  plugins: [
    vue(),
    VitePWA({
      // 完整的Manifest配置，必填项不能少
      manifest: {
        name: '美食应用',
        short_name: '美食App',
        description: '专属美食浏览应用',
        start_url: '/',
        display: 'standalone', // 必须设置为standalone/fullscreen等触发安装提示的模式
        background_color: '#fff',
        theme_color: '#41b883',
        icons: [
          {
            src: 'icons/icon-192x192.png', // 确保图标文件存在于public目录
            sizes: '192x192',
            type: 'image/png'
          },
          {
            src: 'icons/icon-512x512.png',
            sizes: '512x512',
            type: 'image/png'
          }
        ]
      },
      // 启用开发模式的PWA支持
      devOptions: {
        enabled: true,
        suppressWarnings: true,
        navigateFallback: 'index.html'
      },
      // Workbox配置确保Service Worker正常运行
      workbox: {
        globPatterns: ['**/*.{html,js,css,ico,png,svg}']
      }
    })
  ],
  base: '/' // 确保部署根路径，避免Manifest路径错误
})

2. 开发模式启用PWA #

默认情况下vite-plugin-pwa在开发模式不启用PWA，需要在devOptions中设置enabled: true，这样开发环境也能触发安装提示。重启vite服务后，打开Chrome开发者工具的Application标签，检查：

• Manifest是否正常加载（无报错）
• Service Worker是否注册并激活

3. 预览模式验证 #

执行npm run build构建项目，再运行npm run preview，检查：

• dist目录下是否生成了manifest.json
• dist/index.html中是否有插件自动注入的<link rel="manifest" href="/manifest.json">标签

4. 满足安装提示触发条件 #

Chrome触发安装提示需要满足以下规则：

• 页面处于安全环境（localhost自动视为安全，线上需HTTPS）
• Manifest包含name、short_name、start_url、display（至少standalone）
• Service Worker已注册并激活
• 用户至少两次访问页面，且两次间隔≥5分钟（可通过Chrome开发者工具的Application > Service Workers > Skip waiting强制触发）

5. Lighthouse检测注意事项 #

• 清除浏览器缓存后再检测
• 确保检测时页面处于HTTPS/localhost环境
• 检查Manifest的所有必填字段是否完整

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