Dynamic File Router for React Apps

routes.tsx

// src/routes.tsx
const ROUTES: {[key: string]: {default: any}} = import.meta.glob('/src/pages/**/[a-z[]*.tsx', { eager: true })


console.log("ROUTES",ROUTES)

const routes: {path: any, element: any}[] = Object.keys(ROUTES).map((route: any) => {
  const path = route
    .replace(/\/src\/pages|index|\.tsx$/g, '')
    .replace(/\[\.{3}.+\]/, '*')
    .replace(/\[(.+)\]/, ':$1')
  console.log("path", path)
  return { path, element: ROUTES[route].default }
})

console.log("routes.tsx", routes)

export default routes