@vite-pwa/nuxt

用于 Nuxt 3 的零配置 PWA 插件

🚀 特性

• 📖 文档 & 指南
• 👌 零配置：为常见用例提供合理的内置默认配置
• 🔩 可扩展：完全暴露自定义插件行为的能力
• 🦾 类型安全：使用 TypeScript 编写
• 🔌 离线支持：生成具有离线支持的服务工作线程（通过 Workbox）
• ⚡ 完全可摇树优化：自动注入 Web 应用程序清单
• 💬 提示新内容：内置对 Vanilla JavaScript、Vue 3、React、Svelte、SolidJS 和 Preact 的支持
• ⚙️ 陈旧数据重验证：当有新内容可用时自动重新加载
• ✨ 静态资源处理：配置静态资源以支持离线
• 🐞 开发支持：在开发应用程序时调试您的自定义服务工作线程逻辑
• 🛠️ 多功能：与元框架集成：îles、SvelteKit、VitePress、Astro、Nuxt 3 和 Remix
• 💥 PWA 资源生成器：从单个命令和单个源图像生成所有 PWA 资源
• 🚀 PWA 资源集成：在您的应用程序中动态提供、生成和注入 PWA 资源

📦 安装

从 v0.4.0 开始，@vite-pwa/nuxt 需要 Vite 5 和 Nuxt 3.9.0+。

对于旧版本，@vite-pwa/nuxt 需要 Vite 3.2.0+ 和 Nuxt 3.0.0+。

npx nuxi@latest module add @vite-pwa/nuxt

🦄 用法

将 @vite-pwa/nuxt 模块添加到 nuxt.config.ts 并进行配置

// nuxt.config.ts
import { defineNuxtConfig } from 'nuxt/config'

export default defineNuxtConfig({
  modules: [
    '@vite-pwa/nuxt'
  ],
  pwa: {
    /* PWA options */
  }
})

阅读📖 文档，获取关于如何配置和使用此插件的完整指南。

⚡️ 示例

您需要停止已启动的开发服务器，然后才能看到 PWA 的实际运行情况

• nr dev:preview:build：Nuxt 构建命令 + 启动服务器
• nr dev:preview:generate：Nuxt 生成命令 + 启动服务器

示例	源代码	游乐场
自动更新 PWA	GitHub

👀 完整配置

查看类型声明 src/types.ts 和以下链接以获取更多详细信息。

• Web 应用清单
• Workbox

📄 许可证

MIT 许可证 © 2023-PRESENT Anthony Fu