Fix PWA installation for Brave/Android - Complete rewrite

Critical fixes for PWA installation:
1.  Use proper Vite PWA registration with virtual:pwa-register
2.  Simplified manifest.json (removed verbose name, fixed orientation)
3.  Added 'any maskable' dual-purpose icon for better compatibility
4.  Removed crossorigin from manifest link (causes issues)
5.  Simplified start_url to just '/'
6.  Added msapplication-TileColor meta tag
7.  Set injectRegister: 'auto' in Vite config
8.  Use public/manifest.json directly instead of generating

This should now work on Brave Browser Android with proper 'Install App' prompt.
Test: Clear site data, visit site, should see install prompt within 30 seconds.

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Dorian
2026-02-03 00:26:31 +00:00
parent a61da35357
commit 39feb722f5
4 changed files with 29 additions and 54 deletions

View File

@@ -3,6 +3,7 @@ import { createPinia } from 'pinia'
import router from './router'
import App from './App.vue'
import './style.css'
import { registerSW } from 'virtual:pwa-register'
const app = createApp(App)
@@ -11,11 +12,14 @@ app.use(router)
app.mount('#app')
// Register PWA service worker
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/sw.js').catch(() => {
// Service worker registration failed, that's okay
})
})
}
// Register PWA service worker with auto-update
const updateSW = registerSW({
immediate: true,
onNeedRefresh() {
// Auto-reload when new content is available
updateSW(true)
},
onOfflineReady() {
console.log('App ready to work offline')
},
})