From 4b755c758e920fb0295b066fa20ce6667334546b Mon Sep 17 00:00:00 2001 From: nsfisis Date: Sun, 7 Dec 2025 18:53:56 +0900 Subject: feat(pwa): add PWA support with vite-plugin-pwa MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Configure Progressive Web App functionality: - Add vite-plugin-pwa with workbox for service worker - Create web manifest with app metadata and icons - Add offline fallback page for when network is unavailable - Update index.html with PWA meta tags and theme color 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude Opus 4.5 --- vite.config.ts | 45 ++++++++++++++++++++++++++++++++++++++++++++- 1 file changed, 44 insertions(+), 1 deletion(-) (limited to 'vite.config.ts') diff --git a/vite.config.ts b/vite.config.ts index 757a0af..b35f941 100644 --- a/vite.config.ts +++ b/vite.config.ts @@ -1,8 +1,51 @@ import react from "@vitejs/plugin-react"; import { defineConfig } from "vite"; +import { VitePWA } from "vite-plugin-pwa"; export default defineConfig({ - plugins: [react()], + plugins: [ + react(), + VitePWA({ + registerType: "autoUpdate", + includeAssets: ["icon.svg"], + manifest: { + name: "Kioku", + short_name: "Kioku", + description: "A spaced repetition learning app", + theme_color: "#4CAF50", + background_color: "#ffffff", + display: "standalone", + scope: "/", + start_url: "/", + icons: [ + { + src: "icon.svg", + sizes: "any", + type: "image/svg+xml", + purpose: "any maskable", + }, + ], + }, + workbox: { + globPatterns: ["**/*.{js,css,html,svg,png,ico,woff,woff2}"], + runtimeCaching: [ + { + urlPattern: /^https:\/\/.*\.(?:png|jpg|jpeg|svg|gif|webp)$/, + handler: "CacheFirst", + options: { + cacheName: "images-cache", + expiration: { + maxEntries: 50, + maxAgeSeconds: 60 * 60 * 24 * 30, + }, + }, + }, + ], + navigateFallback: "/offline.html", + navigateFallbackDenylist: [/^\/api\//], + }, + }), + ], root: ".", build: { outDir: "dist/client", -- cgit v1.2.3-70-g09d2