Add VitePWA

HamzaJarane · Jul 20, 2024 · 4e1268d · 4e1268d
1 parent 0579d29
commit 4e1268d
Show file tree

Hide file tree

Showing 3 changed files with 2,211 additions and 16 deletions.
diff --git a/package.json b/package.json
@@ -27,7 +27,8 @@
     "react-contexify": "^6.0.0",
     "react-dom": "^18.3.1",
     "react-gsap": "^3.2.1",
-    "styled-components": "^6.1.11"
+    "styled-components": "^6.1.11",
+    "vite-plugin-pwa": "^0.20.0"
   },
   "devDependencies": {
     "@babel/core": "^7.24.7",

diff --git a/vite.config.ts b/vite.config.ts
@@ -1,7 +1,8 @@
 // vite.config.ts
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-import path from 'path'
+import { defineConfig } from 'vite';
+import { VitePWA } from 'vite-plugin-pwa';
+import react from '@vitejs/plugin-react';
+import path from 'path';
 
 // https://vitejs.dev/config/
 export default defineConfig({
@@ -25,5 +26,12 @@ export default defineConfig({
         plugins: ['babel-plugin-macros', 'babel-plugin-styled-components'],
       },
     }),
+    VitePWA({ 
+      registerType: 'autoUpdate',
+      workbox: {
+        globPatterns: ['**/*.{js,css,html,ico,png,svg,pdf,json}'],
+        maximumFileSizeToCacheInBytes: 5000000, // 5mb
+      }
+    }),
   ],
 })