Is there a way to avoid all Next js routes manually?

Is there an automatic way to render pages dynamically as next js does?
Avoid this code:


const routes = [
  {
    path: "/",
    asyncComponent: () => import("./index"),
  },
  {
    path: "/about",
    asyncComponent: () => import("./about"),
  },
  {
    path: '/blog/:postID',
    asyncComponent: () => import('./blog/[postID]'),
  }
];

what is wrong with this code?

too much code, as you know next js has dynamic routing system.

i never use nextjs
but i know f7-router must have routes.

here is the shortest you can get:

const routes = [
  {
    path: '/',
    _import: './index'
  },
  {
    path: '/about',
    _import: './about'
  },
  {
    path: '/blog/:postID',
    _import: './blog/[postID]'
  }
].map(i => Object.assign(i,{ asyncComponent: () => import(i._import) }));

ok thanks but anyway you gotta define all routes manually :smiley:

yes
and frankly i don’t see it as a bad idea