typescript spread operator must return symbol iterator when combining vue routes

In my Vue router, I am trying to group my routes into separate files,

For example, I have base routes, student routes, etc,

In base routes, I have dashboard page
In student routes, I have students view page, and create students page.

So I created a baseRoute.ts, students.ts files, and concatenate student routes in baseRoute's first index's children array.

So I set it up this way:

in baseRouter.ts:

import { RouteRecordRaw } from "vue-router";
const baseRoute: Array<RouteRecordRaw> = [
    {
        path: "/",
        redirect: "/dashboard",
        component: () => import("@/layout/Layout.vue"),
        children: [
            {
                path: "/dashboard",
                name: "Dashboard",
                component: () => import("@/views/Dashboard.vue")
            }
        ]
    },
    {
        ...
    }
]

export default baseRoute;

in students.ts:

const students = [
    {
        path: "/students",
        name: "Students",
        component: () => import("@/views/Students.vue"),
    },
    {
        path: "/students/activities",
        name: "Student Activities",
        component: () => import("@/views/StudentActivities.vue"),
    },
];

export default students;

now, in router/index.ts

baseRoute[0].children = [
    ...baseRoute[0].children,
    ...students
];

let routes = baseRoutes

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

export default router;

However, I get error saying:

Type 'RouteRecordRaw[] | undefined' must have a '[Symbol.iterator]()' method that returns an iterator.
baseRoute[0].children = [
  ...baseRoute[0].children,
     ^^^^^^^^^^^^^^^^^^^^^
    ...term
]
const routes = baseRoute;