Merge pull request #4 from Pkcarreno/develop

Develop
Pkcarreno · Jun 2, 2024 · 24cc8ae · 24cc8ae
2 parents 5c6d894 + de55270
commit 24cc8ae
Show file tree

Hide file tree

Showing 3 changed files with 47 additions and 5 deletions.
diff --git a/package.json b/package.json
@@ -93,7 +93,7 @@
     "typescript": "^5.4.5",
     "typescript-eslint": "8.0.0-alpha.21",
     "unplugin-fonts": "^1.1.1",
-    "vite": "^5.2.8",
+    "vite": "^5.2.12",
     "vite-plugin-pwa": "^0.20.0",
     "vite-tsconfig-paths": "^4.3.1",
     "vitest": "^1.1.1"

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
diff --git a/vite.config.ts b/vite.config.ts
@@ -3,22 +3,24 @@ import { defineConfig, loadEnv } from 'vite';
 import react from '@vitejs/plugin-react';
 import { VitePWA } from 'vite-plugin-pwa';
 import tsconfigPaths from 'vite-tsconfig-paths';
+import path from 'path';
 
 export default defineConfig(({ mode }) => {
   process.env = { ...process.env, ...loadEnv(mode, process.cwd()) };
   process.env.BASE_URL = process.env.VITE_BASE_URL ?? '';
   return {
-    base: process.env.BASE_URL,
+    base: `${process.env.BASE_URL}/`,
     plugins: [
       react(),
       tsconfigPaths(),
       VitePWA({
+        strategies: 'generateSW',
         registerType: 'autoUpdate',
         injectRegister: 'auto',
         manifest: {
           name: 'JS on Demand',
           short_name: 'JSOD',
-          start_url: '/',
+          start_url: `${process.env.BASE_URL}/`,
           display: 'standalone',
           background_color: '#FDFEFB',
           theme_color: '#fdfefb',
@@ -51,7 +53,37 @@ export default defineConfig(({ mode }) => {
           ],
         },
         workbox: {
-          globPatterns: ['**/*.{js,css,html,ico,png,svg}'],
+          globPatterns: ['**/*.{html,js,css,woff,woff2,ttf,eot,ico}'],
+          runtimeCaching: [
+            {
+              urlPattern: /\.(?:png|jpg|jpeg|svg|gif|webp|avif)$/,
+              handler: 'CacheFirst',
+              options: {
+                cacheName: 'images',
+                expiration: {
+                  maxEntries: 100,
+                  maxAgeSeconds: 30 * 24 * 60 * 60,
+                },
+              },
+            },
+            {
+              urlPattern: /\.(?:woff|woff2|ttf|eot|ico)$/,
+              handler: 'CacheFirst',
+              options: {
+                cacheName: 'fonts',
+                expiration: {
+                  maxEntries: 10,
+                  maxAgeSeconds: 30 * 24 * 60 * 60,
+                },
+              },
+            },
+          ],
+          navigateFallback: null,
+          cleanupOutdatedCaches: true,
+          clientsClaim: true,
+        },
+        injectManifest: {
+          globPatterns: ['**/*.{js,css,html,svg,png,svg,ico}'],
         },
       }),
       Unfonts({
@@ -61,11 +93,13 @@ export default defineConfig(({ mode }) => {
               name: 'IBM Plex Sans',
               weights: [400, 500, 600, 700],
               styles: ['italic', 'normal'],
+              subset: 'latin',
             },
             {
               name: 'IBM Plex Mono',
               weights: [400],
               styles: ['italic', 'normal'],
+              subset: 'latin',
             },
           ],
         },
@@ -75,6 +109,14 @@ export default defineConfig(({ mode }) => {
       APP_VERSION: JSON.stringify(process.env.npm_package_version),
       BASE_URL: JSON.stringify(process.env.BASE_URL),
     },
+    worker: {
+      format: 'es',
+    },
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, './src'),
+      },
+    },
     test: {
       globals: true,
       environment: 'happy-dom',