/app-router

App route core package for js runtime

Primary LanguageTypeScript

App Route

App route core package for js runtime, e.g Node Bun.

Install

npm i @app-route/core

Usage

  • build build the directory tree
  • match match url return directory node and params

example:

import { build, match } from "@app-route/core";

const root = await build("./app", {
  resolve: async (node) => {
    // return extra data to `node.resolved`
    // example:
    return {
      hello: "world",
    };
  },
});

const matched = match("/hello", root);

if (!matched) return;

const [node, params] = matched;

// node.resolved.hello === "world"
// params: {}

Dynamic Routes

The App Router file system routing has three types of dynamic route segments

  • [slug]
  • [...slug]
  • [[...slug]]
app
├── roles
│   └── [id]
│       └── [name]
├── posts
│   └── [[...ids]]
└── users
    └── [...ids]

Corresponding URLs, routes, and parameter matching table

URL Route Params
/roles/a/b roles/[id]/[name] { "id": "a", "name": "b" }
/roles/a roles/[id] { "id": "a" }
/users/a/b users/[...ids] { "ids": ["a", "b"] }
/users/a users/[...ids] { "ids": ["a"] }
/users users {}
/posts/a/b posts/[[...ids]] { "ids": ["a", "b"] }
/posts/a posts/[[...ids]] { "ids": ["a"] }
/posts posts/[[...ids]] {"ids": []}

Get Params in the interface

Node Struct

interface BasicTreeNode<R = unknown> {
  name: string;
  route: string | undefined;
  path: string;
  parent?: BasicTreeNode<R>;
  children: BasicTreeNode<R>[];
  resolved?: R;
}

LICENSE

MIT @anuoua