Add adapter for GH pages

.github/workflows/deploy.yml

@@ -18,6 +18,7 @@ jobs:
 
       - name: Install and Build
         run: |
+          export NODE_ENV=production
           npm install
           npm run build
           

package-lock.json

@@ -16,6 +16,7 @@
         "prettier": "^3.2.5",
         "prettier-plugin-svelte": "^3.2.3",
         "svelte": "5.0.0-next.54",
+        "svelte-adapter-ghpages": "^0.2.2",
         "svelte-check": "^3.6.0",
         "tailwindcss": "^3.4.3",
         "tslib": "^2.4.1",
@@ -753,6 +754,15 @@
         "@sveltejs/kit": "^2.0.0"
       }
     },
+    "node_modules/@sveltejs/adapter-static": {
+      "version": "3.0.1",
+      "resolved": "https://registry.npmjs.org/@sveltejs/adapter-static/-/adapter-static-3.0.1.tgz",
+      "integrity": "sha512-6lMvf7xYEJ+oGeR5L8DFJJrowkefTK6ZgA4JiMqoClMkKq0s6yvsd3FZfCFvX1fQ0tpCD7fkuRVHsnUVgsHyNg==",
+      "dev": true,
+      "peerDependencies": {
+        "@sveltejs/kit": "^2.0.0"
+      }
+    },
     "node_modules/@sveltejs/kit": {
       "version": "2.5.7",
       "resolved": "https://registry.npmjs.org/@sveltejs/kit/-/kit-2.5.7.tgz",
@@ -2643,6 +2653,21 @@
         "node": ">=18"
       }
     },
+    "node_modules/svelte-adapter-ghpages": {
+      "version": "0.2.2",
+      "resolved": "https://registry.npmjs.org/svelte-adapter-ghpages/-/svelte-adapter-ghpages-0.2.2.tgz",
+      "integrity": "sha512-1eQFGK7UJ3qZbnv8mLvlUbRh0JtD8Mqp3LWRzwOfL+aL4y8SiGfcr+8P/iRQ69v+hOyC6cZ2cqB7o8g97ofWjA==",
+      "dev": true,
+      "dependencies": {
+        "@sveltejs/adapter-static": "^2.0.0 || ^3.0.0"
+      },
+      "funding": {
+        "url": "https://github.com/sponsors/ota-meshi"
+      },
+      "peerDependencies": {
+        "@sveltejs/kit": "^1.0.0 || ^2.0.0"
+      }
+    },
     "node_modules/svelte-check": {
       "version": "3.6.9",
       "resolved": "https://registry.npmjs.org/svelte-check/-/svelte-check-3.6.9.tgz",

package.json

@@ -20,6 +20,7 @@
     "prettier": "^3.2.5",
     "prettier-plugin-svelte": "^3.2.3",
     "svelte": "5.0.0-next.54",
+    "svelte-adapter-ghpages": "^0.2.2",
     "svelte-check": "^3.6.0",
     "tailwindcss": "^3.4.3",
     "tslib": "^2.4.1",

src/routes/404.svelte

@@ -0,0 +1,4 @@
+<h1>404</h1>
+<blockquote>
+  <p>Not Found</p>
+</blockquote>

svelte.config.js

@@ -1,4 +1,5 @@
 import adapter from "@sveltejs/adapter-auto"
+import adapterGhpages from "svelte-adapter-ghpages";
 import { vitePreprocess } from "@sveltejs/vite-plugin-svelte"
 
 /** @type {import('@sveltejs/kit').Config} */
@@ -18,12 +19,14 @@ const config = {
   // Consult https://kit.svelte.dev/docs/integrations#preprocessors
   // for more information about preprocessors
   preprocess: vitePreprocess(),
-
   kit: {
-    // adapter-auto only supports some environments, see https://kit.svelte.dev/docs/adapter-auto for a list.
-    // If your environment is not supported, or you settled on a specific environment, switch out the adapter.
-    // See https://kit.svelte.dev/docs/adapters for more information about adapters.
-    adapter: adapter(),
+    // Use different adapters based on the environment. 
+    // For GitHub Pages deployment, use svelte-adapter-ghpages. 
+    // For local development, you can use a different adapter like @sveltejs/adapter-static or any other suitable one.
+    adapter: process.env.NODE_ENV === 'production' ? adapterGhpages() : adapter(),
+    paths: {
+      base: process.env.NODE_ENV === 'production' ? "/BreakOften" : "",
+    },
   },
 }