fix: Remove vite-plugin-pwa, avoid this plugin caches files unexpectedly (#6907)

Also fixed webpush wrong msg

Co-authored-by: Louis Lam <louislam@users.noreply.github.com>

config/vite.config.js

@@ -2,7 +2,6 @@ import vue from "@vitejs/plugin-vue";
 import { defineConfig } from "vite";
 import visualizer from "rollup-plugin-visualizer";
 import viteCompression from "vite-plugin-compression";
-import { VitePWA } from "vite-plugin-pwa";
 
 const postCssScss = require("postcss-scss");
 const postcssRTLCSS = require("postcss-rtlcss");
@@ -31,15 +30,6 @@ export default defineConfig({
             algorithm: "brotliCompress",
             filter: viteCompressionFilter,
         }),
-        VitePWA({
-            registerType: null,
-            srcDir: "src",
-            filename: "serviceWorker.ts",
-            strategies: "injectManifest",
-            injectManifest: {
-                maximumFileSizeToCacheInBytes: 3 * 1024 * 1024, // 3 MiB
-            },
-        }),
     ],
     css: {
         postcss: {

package.json

@@ -95,8 +95,8 @@
         "express-static-gzip": "~2.1.7",
         "feed": "^4.2.2",
         "form-data": "~4.0.0",
-        "globalping": "^0.2.0",
         "gamedig": "^5.0.1",
+        "globalping": "^0.2.0",
         "html-escaper": "^3.0.3",
         "http-cookie-agent": "~5.0.4",
         "http-graceful-shutdown": "~3.1.7",
@@ -211,7 +211,6 @@
         "v-pagination-3": "~0.1.7",
         "vite": "~5.4.15",
         "vite-plugin-compression": "^0.5.1",
-        "vite-plugin-pwa": "^1.1.0",
         "vue": "~3.5.26",
         "vue-chartjs": "~5.2.0",
         "vue-confirm-dialog": "~1.0.2",

public/sw.js

@@ -1,8 +1,3 @@
-// Needed per Vite PWA docs
-import { precacheAndRoute } from "workbox-precaching";
-declare let self: ServiceWorkerGlobalScope;
-precacheAndRoute(self.__WB_MANIFEST);
-
 // Receive push notifications
 self.addEventListener("push", function (event) {
     if (self.Notification?.permission !== "granted") {

server/notification-providers/Webpush.js

@@ -1,5 +1,4 @@
 const NotificationProvider = require("./notification-provider");
-const { UP } = require("../../src/util");
 const webpush = require("web-push");
 const { setting } = require("../util-server");
 
@@ -18,24 +17,9 @@ class Webpush extends NotificationProvider {
 
             webpush.setVapidDetails("https://github.com/louislam/uptime-kuma", publicVapidKey, privateVapidKey);
 
-            if (heartbeatJSON === null && monitorJSON === null) {
-                // Test message
-                const data = JSON.stringify({
-                    title: "TEST",
-                    body: `Test Alert - ${msg}`,
-                });
-
-                await webpush.sendNotification(notification.subscription, data);
-
-                return okMsg;
-            }
-
             const data = JSON.stringify({
-                title: heartbeatJSON["status"] === UP ? "Monitor Up" : "Monitor DOWN",
-                body:
-                    heartbeatJSON["status"] === UP
-                        ? `❌ ${heartbeatJSON["name"]} is DOWN`
-                        : `✅ ${heartbeatJSON["name"]} is UP`,
+                title: "Uptime Kuma",
+                body: msg,
             });
 
             await webpush.sendNotification(notification.subscription, data);

src/main.js

@@ -44,6 +44,12 @@ app.component("FontAwesomeIcon", FontAwesomeIcon);
 
 app.mount("#app");
 
+if ("serviceWorker" in navigator) {
+    navigator.serviceWorker.register("/sw.js", { scope: "/" }).catch((error) => {
+        console.error("Service worker registration failed:", error);
+    });
+}
+
 // Expose the vue instance for development
 if (process.env.NODE_ENV === "development") {
     console.log("Dev Only: window.app is the vue instance");