wip: setup multi-level routing

src/pages/options/index.ts

@@ -2,6 +2,7 @@ import { createApp } from "vue";
 import { createRouter, createWebHashHistory } from "vue-router";
 import App from "./App.vue";
 import Settings from "./routes/Settings.vue";
+import General from "./routes/Settings/General.vue";
 import Developer from "./routes/Settings/Developer.vue";
 import Inventory from "./routes/Inventory.vue";
 import Onboarding from "./routes/Onboarding.vue";
@@ -15,12 +16,20 @@ const router = createRouter
     history: createWebHashHistory(),
     routes:
     [
+        {
+            path: "/",
+            redirect: "/settings",
+        },
         {
             path: "/settings",
             component: Settings,
-            alias: "/",
+            redirect: "/settings/general",
             children:
             [
+                {
+                    path: "general",
+                    component: General,
+                },
                 {
                     path: "developer",
                     component: Developer,

src/pages/options/routes/Settings.vue

@@ -2,6 +2,7 @@
 
 <template>
     <p>Settings!</p>
+    <RouterView></RouterView>
 </template>
 
 <style scoped></style>

src/pages/options/routes/Settings/Developer.vue

@@ -1,6 +1,8 @@
 <script setup lang="ts">
 </script>
 
-<template></template>
+<template>
+    <p>Developer</p>
+</template>
 
 <style scoped></style>

src/pages/options/routes/Settings/General.vue

@@ -0,0 +1,9 @@
+<script setup lang="ts">
+</script>
+
+<template>
+    <p>General</p>
+</template>
+
+<style scoped>
+</style>