PWA

package.json

@@ -1,6 +1,6 @@
 {
     "name": "pulsar-web",
-    "version": "0.7.1",
+    "version": "0.7.2",
     "description": "",
     "type": "module",
     "scripts": {
@@ -17,6 +17,7 @@
         "tailwindcss": "^4.1.13",
         "typescript": "^5.9.2",
         "vite": "^7.1.4",
+        "vite-plugin-pwa": "^1.2.0",
         "vite-plugin-solid": "^2.11.8"
     },
     "dependencies": {

src/index.tsx

@@ -1,16 +1,19 @@
 /* @refresh reload */
-import './index.css';
-import { render } from 'solid-js/web';
-import 'solid-devtools';
+import "./index.css";
+import { render } from "solid-js/web";
+import "solid-devtools";
+import { registerSW } from "virtual:pwa-register";
 
-import App from './App';
+import App from "./App";
 
-const root = document.getElementById('root');
+registerSW();
+
+const root = document.getElementById("root");
 
 if (import.meta.env.DEV && !(root instanceof HTMLElement)) {
-  throw new Error(
-    'Root element not found. Did you forget to add it to your index.html? Or maybe the id attribute got misspelled?',
-  );
+    throw new Error(
+        "Root element not found. Did you forget to add it to your index.html? Or maybe the id attribute got misspelled?",
+    );
 }
 
 render(() => <App />, root!);

tsconfig.json

@@ -1,20 +1,24 @@
 {
-  "compilerOptions": {
-    // General
-    "jsx": "preserve",
-    "jsxImportSource": "solid-js",
-    "target": "ESNext",
+    "compilerOptions": {
+        // General
+        "jsx": "preserve",
+        "jsxImportSource": "solid-js",
+        "target": "ESNext",
 
-    // Modules
-    "allowSyntheticDefaultImports": true,
-    "esModuleInterop": true,
-    "isolatedModules": true,
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "noEmit": true,
+        // Modules
+        "allowSyntheticDefaultImports": true,
+        "esModuleInterop": true,
+        "isolatedModules": true,
+        "module": "ESNext",
+        "moduleResolution": "bundler",
+        "noEmit": true,
 
-    // Type Checking & Safety
-    "strict": true,
-    "types": ["vite/client"]
-  }
+        // Type Checking & Safety
+        "strict": true,
+        "types": [
+            "vite/client",
+            "vite-plugin-pwa/info.d.ts",
+            "vite-plugin-pwa/client.d.ts",
+        ],
+    },
 }

vite.config.ts

@@ -1,14 +1,42 @@
-import tailwindcss from '@tailwindcss/vite';
-import { defineConfig } from 'vite';
-import solidPlugin from 'vite-plugin-solid';
-import devtools from 'solid-devtools/vite';
+import tailwindcss from "@tailwindcss/vite";
+import { defineConfig } from "vite";
+import solidPlugin from "vite-plugin-solid";
+import devtools from "solid-devtools/vite";
+import { VitePWA } from "vite-plugin-pwa";
 
 export default defineConfig({
-  plugins: [devtools(), solidPlugin(), tailwindcss()],
-  server: {
-    port: 3000,
-  },
-  build: {
-    target: 'esnext',
-  },
+    plugins: [
+        devtools(),
+        solidPlugin(),
+        tailwindcss(),
+        VitePWA({
+            registerType: "autoUpdate",
+            manifest: {
+                name: "Pulsar",
+                short_name: "Pulsar",
+                start_url: "/app",
+                display: "standalone",
+                background_color: "#ffffff",
+                theme_color: "#4f46e5",
+                icons: [
+                    {
+                        src: "/icons/icon-192.png",
+                        sizes: "192x192",
+                        type: "image/png",
+                    },
+                    {
+                        src: "/icons/icon-512.png",
+                        sizes: "512x512",
+                        type: "image/png",
+                    },
+                ],
+            },
+        }),
+    ],
+    server: {
+        port: 3000,
+    },
+    build: {
+        target: "esnext",
+    },
 });