chore: add vite-aliases

package.json

@@ -19,7 +19,8 @@
     "tailwindcss": "^3.4.4",
     "tslib": "^2.6.3",
     "typescript": "^5.2.2",
-    "vite": "^5.3.1"
+    "vite": "^5.3.1",
+    "vite-aliases": "^0.11.7"
   },
   "keywords": [
     "game",

src/App.svelte

@@ -1,9 +1,9 @@
 <script lang="ts">
-  import {page} from "./lib/store";
-  import Canvas from "./pages/Canvas.svelte";
-  import Effects from "./pages/Effects.svelte";
-  import Spellbook from "./pages/Spellbook.svelte";
-  import Strokes from "./pages/Strokes.svelte";
+  import {page} from "~lib/store";
+  import Canvas from "~pages/Canvas.svelte";
+  import Effects from "~pages/Effects.svelte";
+  import Spellbook from "~pages/Spellbook.svelte";
+  import Strokes from "~pages/Strokes.svelte";
 </script>
 
 {#if $page === "canvas"}<Canvas />{/if}

src/pages/Canvas.svelte

@@ -1,13 +1,13 @@
 <script lang="ts">
   import {onMount} from "svelte";
-  import PageContainer from "../components/PageContainer.svelte";
-  import PrimaryButton from "../components/PrimaryButton.svelte";
-  import {FADE_SPEED, HUE, MIN_POINTS, PI2} from "../lib/config";
-  import DollarRecognizer from "../lib/dollar";
-  import {createEffect, type Particle} from "../lib/effects";
-  import spells, {type SpellConfig} from "../lib/spells";
-  import {page} from "../lib/store";
-  import strokes from "../lib/strokes";
+  import PageContainer from "~components/PageContainer.svelte";
+  import PrimaryButton from "~components/PrimaryButton.svelte";
+  import {FADE_SPEED, HUE, MIN_POINTS, PI2} from "~lib/config";
+  import DollarRecognizer from "~lib/dollar";
+  import {type Particle, createEffect} from "~lib/effects";
+  import spells, {type SpellConfig} from "~lib/spells";
+  import {page} from "~lib/store";
+  import strokes from "~lib/strokes";
 
   let container: HTMLElement;
   let mainCanvas: HTMLCanvasElement;

src/pages/Effects.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
   import {onMount} from "svelte";
-  import PageContainer from "../components/PageContainer.svelte";
-  import PrimaryButton from "../components/PrimaryButton.svelte";
-  import {PI2} from "../lib/config";
-  import {createEffect, effectsMap, type Effect, type Particle} from "../lib/effects";
-  import {page} from "../lib/store";
+  import PageContainer from "~components/PageContainer.svelte";
+  import PrimaryButton from "~components/PrimaryButton.svelte";
+  import {PI2} from "~lib/config";
+  import {createEffect, type Effect, effectsMap, type Particle} from "~lib/effects";
+  import {page} from "~lib/store";
 
   let container: HTMLElement;
   let particleCanvas: HTMLCanvasElement;

src/pages/Spellbook.svelte

@@ -1,11 +1,11 @@
 <script lang="ts">
   import {draw, fly} from "svelte/transition";
-  import PageContainer from "../components/PageContainer.svelte";
-  import PrimaryButton from "../components/PrimaryButton.svelte";
-  import {DRAW_TIME} from "../lib/config";
-  import spells from "../lib/spells";
-  import {page} from "../lib/store";
-  import strokes from "../lib/strokes";
+  import PageContainer from "~components/PageContainer.svelte";
+  import PrimaryButton from "~components/PrimaryButton.svelte";
+  import {DRAW_TIME} from "~lib/config";
+  import spells from "~lib/spells";
+  import {page} from "~lib/store";
+  import strokes from "~lib/strokes";
 
   let spellIndex = 0;
   let currentSpell = spells[spellIndex];

src/pages/Strokes.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
   import {draw} from "svelte/transition";
-  import PageContainer from "../components/PageContainer.svelte";
-  import PrimaryButton from "../components/PrimaryButton.svelte";
-  import {DRAW_TIME} from "../lib/config";
-  import {page} from "../lib/store";
-  import strokes from "../lib/strokes";
+  import PageContainer from "~components/PageContainer.svelte";
+  import PrimaryButton from "~components/PrimaryButton.svelte";
+  import {DRAW_TIME} from "~lib/config";
+  import {page} from "~lib/store";
+  import strokes from "~lib/strokes";
 
   let animated: Record<string, boolean> = {};
 </script>

tsconfig.json

@@ -8,8 +8,20 @@
     "allowJs": true,
     "checkJs": false,
     "isolatedModules": true,
-    "moduleDetection": "force"
+    "moduleDetection": "force",
+    "baseUrl": "",
+    "paths": {
+      "~assets/*": ["src/assets/*"],
+      "~components/*": ["src/components/*"],
+      "~lib/*": ["src/lib/*"],
+      "~pages/*": ["src/pages/*"],
+      "~/*": ["src/*"]
+    }
   },
   "include": ["src/**/*.ts", "src/**/*.js", "src/**/*.svelte"],
-  "references": [{"path": "./tsconfig.node.json"}]
+  "references": [
+    {
+      "path": "./tsconfig.node.json"
+    }
+  ]
 }

vite.config.ts

@@ -1,11 +1,12 @@
 import {svelte} from "@sveltejs/vite-plugin-svelte";
 import {defineConfig} from "vite";
+import {ViteAliases} from "vite-aliases";
 
 // https://vitejs.dev/config/
 export default defineConfig({
   base: "", // relative paths
   build: {
     sourcemap: true
   },
-  plugins: [svelte()]
+  plugins: [svelte(), ViteAliases()]
 });