mirror of
https://github.com/wu736139669/hapi.git
synced 2026-08-05 06:24:37 +00:00
Add complete PWA implementation including service worker registration, offline support, and installation prompts: - Add vite-plugin-pwa and workbox-window dependencies for PWA tooling - Configure VitePWA plugin with web app manifest and app metadata - Set up Workbox caching strategies for API endpoints and CDN assets - Implement service worker auto-update with user-triggered refresh - Create usePWAInstall hook to handle beforeinstallprompt events - Create useOnlineStatus hook for monitoring network connectivity - Add InstallPrompt component with haptic feedback integration - Add OfflineBanner component to notify users of offline status - Configure PWA icons and assets (64x64, 192x192, 512x512 variants) - Add TypeScript type declarations for virtual PWA register module - Integrate PWA components and service worker into App.tsx and main.tsx - Add PWA meta tags and viewport configuration to index.html
43 lines
1.6 KiB
HTML
43 lines
1.6 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta
|
|
name="viewport"
|
|
content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, user-scalable=no, viewport-fit=cover"
|
|
/>
|
|
|
|
<!-- PWA Meta Tags -->
|
|
<meta name="theme-color" content="#ffffff" media="(prefers-color-scheme: light)" />
|
|
<meta name="theme-color" content="#1c1c1e" media="(prefers-color-scheme: dark)" />
|
|
<meta name="description" content="AI-powered development assistant" />
|
|
|
|
<!-- iOS PWA Meta Tags -->
|
|
<meta name="apple-mobile-web-app-capable" content="yes" />
|
|
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
|
|
<meta name="apple-mobile-web-app-title" content="Happy" />
|
|
<link rel="apple-touch-icon" href="/apple-touch-icon-180x180.png" />
|
|
|
|
<!-- Favicon -->
|
|
<link rel="icon" href="/favicon.ico" sizes="48x48" />
|
|
<link rel="icon" href="/icon.svg" sizes="any" type="image/svg+xml" />
|
|
|
|
<!-- Safari Pinned Tab -->
|
|
<link rel="mask-icon" href="/mask-icon.svg" color="#111827" />
|
|
|
|
<title>Happy Mini App</title>
|
|
<script type="importmap">
|
|
{
|
|
"imports": {
|
|
"socket.io-client": "https://cdn.socket.io/4.8.1/socket.io.esm.min.js"
|
|
}
|
|
}
|
|
</script>
|
|
<script src="https://telegram.org/js/telegram-web-app.js"></script>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
<script type="module" src="/src/main.tsx"></script>
|
|
</body>
|
|
</html>
|