A simple utility for ranking routes based on their specificity
yarn add @tanstack/react-location-rank-routes# ornpm i @tanstack/react-location-rank-routes
import { ReactLocation, Router } from '@tanstack/react-location'import { rankRoutes } from '@tanstack/react-location-rank-routes'//const location = new ReactLocation()function App() {return (<Routerlocation={location}filterRoutes={rankRoutes}routes={[{path: '/',},{path: '/todos',},{path: '/todos/:todoId',children: [{path: '/',},{path: '/tasks',},{path: '/tasks/:taskId',},{path: '/',},],},{path: '/',},]}/>)}
The Routes above will be filtered and ranked in the following order:
const routes = [{path: '/',},{path: '/todos/:todoId',children: [{path: '/',},{path: '/tasks/:taskId',},{path: '/tasks',},{path: '/*',},],},{path: '/todos',},{path: '/*',},]
The best JavaScript newsletter! Delivered every Monday to over 76,000 devs.