ludash/src/router/index.js

import { createRouter, createWebHashHistory } from "vue-router";
import { defineComponent } from "vue";

const DynamicComponent = defineComponent({
  name: "DynamicComponent",
  render() {
    return <router-view></router-view>;
  },
});

/**
 * @type {import("vue-router").RouteRecordRaw[]}
 */
const routes = [
  {
    path: "/",
    name: "home",
    redirect: {
      name: "sdk",
    },
  },
  {
    path: "/install",
    name: "install",
    component: DynamicComponent,
    children: [
      {
        path: "",
        name: "install",
        component: () =>
          import(/* webpackChunkName: "install" */ "../views/install.vue"),
      },
    ],
  },
  {
    path: "/flow",
    name: "flow",
    component: DynamicComponent,
    children: [
      {
        path: "",
        name: "svg",
        component: () =>
          import(/* webpackChunkName: "svg" */ "../views/svg/index.vue"),
      },
    ],
  },
  {
    path: "/webgl",
    name: "webgl",
    component: DynamicComponent,
    children: [
      {
        path: "",
        name: "webglIndex",
        component: () =>
          import(/* webpackChunkName: "webgl" */ "../views/webgl/index.vue"),
      },
    ],
  },
  {
    path: "/sdk",
    name: "sdk",
    component: DynamicComponent,
    children: [
      {
        path: "queue",
        name: "queue",
        component: () =>
          import(/* webpackChunkName: "queue" */ "../views/queue.vue"),
      },
      {
        path: "async",
        name: "async",
        component: () =>
          import(/* webpackChunkName: "async" */ "../views/async.vue"),
      },
      {
        path: "storage",
        name: "storage",
        component: () =>
          import(/* webpackChunkName: "storage" */ "../views/storage.vue"),
      },
      {
        path: "flexible",
        name: "flexible",
        component: () =>
          import(/* webpackChunkName: "flexible" */ "../views/flexible.vue"),
      },
      {
        path: "http",
        name: "http",
        component: () =>
          import(/* webpackChunkName: "http" */ "../views/http.vue"),
      },
      {
        path: "formula",
        name: "formula",
        component: () =>
          import(/* webpackChunkName: "formula" */ "../views/formula.vue"),
      },
      {
        path: "thread",
        name: "thread",
        component: () =>
          import(/* webpackChunkName: "thread" */ "../views/thread.vue"),
      },
      {
        path: "",
        redirect: {
          name: "queue",
        },
      },
      {
        path: "/:pathMatch(.*)",
        redirect: {
          name: "queue",
        },
      },
    ],
  },
];

const router = createRouter({
  history: createWebHashHistory(),
  routes,
});

export default router;