How to make index.js Vue router dynamic?

Question

I'm trying to make index.js in vue.js dynamic instead of me having to go in a manually add a page path or name.

What i'm hoping for is to use $route from the data (see screenshot ) in router > index.js so something like the below if possible.

  {
    path: $route.path,
    name: $route.name,
    component: () =>
      import(/* webpackChunkName: "about" */ "../views/mainPages.vue"),
    props: true,
  },

instead of having to manually add a new block every time. See example

 {
    path: "/jobs/other-jobs",
    name: "other-jobs",
    component: () =>
      import(/* webpackChunkName: "about" */ "../views/mainPages.vue"),
    props: true,
  },

Any help would be greatly appreciated.