Service Worker works in dev, but in production get error Failed to execute 'importScripts' on ' #419
Description
Hello I'm trying to implement my firebase notification background service worker..
While this works in devmode
vite.config.ts
VitePWA({
base: '/',
srcDir: 'src',
filename: 'firebase-messaging-sw.js',
registerType: 'autoUpdate',
devOptions: {
enabled: true
},
workbox: {
globPatterns: ['**/*.{js,css,html}', '**/*.{svg,png,jpg,gif}'],
mode: 'production',
swDest: 'dist/firebase-messaging-sw.js'
},
}),
Firebase.tsx (imported in App)
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/firebase-messaging-sw.js', { scope: '/', type: 'module' }).then(serviceWorkerRegistration => {
if(serviceWorkerRegistration.installing) {
console.log('Service worker installing');
} else if(serviceWorkerRegistration.waiting) {
console.log('Service worker installed');
} else if(serviceWorkerRegistration.active) {
console.log('Service worker active');
}
getToken(getMessaging(fapp), {
serviceWorkerRegistration,
vapidKey: `SECRET_KEY`,
}).then((state) => {
console.log(state);
})
})
})
}
Error in production:
Uncaught (in promise) TypeError: Failed to execute 'importScripts' on 'WorkerGlobalScope': Module scripts don't support importScripts().
how can I Correct that ?