Registry / web-framework / build-route-tree

build-route-tree

library1.0.3jsnpmunverified

build-route-tree is a JavaScript/TypeScript library designed to create strongly typed route trees, significantly reducing errors associated with magic strings in URL paths. It provides a structured, object-oriented approach to defining application routes, enabling IDE autocompletion and compile-time validation for paths and parameters. Currently at version 1.0.3, the library appears to follow a release cadence driven by feature additions and bug fixes, typical for a new utility. Its key differentiator is the focus on full type inference for route paths and parameters, offering methods like `getRoutePath`, `getRedirectPath`, and `getElementKey` on each route node to retrieve path components and construct dynamic URLs safely. This helps encapsulate route logic and improve maintainability compared to manual string interpolation or less type-safe routing solutions.

web-framework

npm install build-route-tree

github ↗package ↗

INSTALL

IMPORT

SIG · BUILD-ROUTE-TREE

build-route-tree

web-frameworkjavascriptv1.0.3

Install

—

Import

—

Disk

—

Pass rate

0/ 6

Env Coverage0 / 6

glibc

18–22

musl

18–22

Install & Compatibility

Where this runs

tested against v? · npm install

Install × environment matrix

Each cell = how many times install + import succeeded across repeated harness runs. Partial = flaky.
glibc = Debian/Ubuntu slim · musl = Alpine Linux

musl

node 18–226 runs

build_error

glibc

node 18–226 runs

build_error

Code

Verified usage

Verified import paths — ran on the pinned version, not inferred.

buildRouteTree

✓ import buildRouteTree from 'build-route-tree';

✗ import { buildRouteTree } from 'build-route-tree';

This is the primary default export function for building the route tree.

getParam

✓ import { getParam } from 'build-route-tree';

✗ import getParam from 'build-route-tree';

A named export utility function used to mark dynamic route segments within the tree definition.

Demonstrates how to define a typed route tree using `buildRouteTree` and `getParam` for dynamic segments, then accessing its generated paths and constructing dynamic URLs safely.

import buildRouteTree, { getParam } from 'build-route-tree'; interface UserRouteParams { uuid: string; } const rawTree = { home: { loans: {}, user: { uuid: getParam<UserRouteParams>(), // Define 'uuid' as a dynamic parameter security: { '2fa': {}, sms: {}, }, balances: {}, }, }, preview: {}, }; const routes = buildRouteTree(rawTree); // Example usage: console.log(routes.home.loans.getRoutePath()); // e.g., "/home/loans" console.log(routes.home.user.security['2fa'].getRoutePath()); // e.g., "/home/user/security/2fa" // Accessing a dynamic route const userProfilePath = routes.home.user.uuid.getRedirectPath({ uuid: '123-abc-456' }); console.log(userProfilePath); // e.g., "/home/user/123-abc-456" // Accessing methods on a dynamic segment parent const userSecurity2fa = routes.home.user.uuid.security['2fa'].getRedirectPath({ uuid: 'test-user-id' }); console.log(userSecurity2fa); // e.g., "/home/user/test-user-id/security/2fa"

Debug

Known issues

gotchaAttempting to use a route object directly as a string (e.g., `<Link to={routes.home.loans} />`) will result in a runtime error or an incorrect path. Route nodes are objects with methods.

fix

Always call `getRoutePath()` or `getRedirectPath(params)` on the route node to obtain the correct string path.

affects: >=1.0.0

gotchaThe `getParam` function is crucial for defining dynamic segments. If a route segment is intended to be dynamic (e.g., `/users/:id`), but `getParam()` is not used, the segment will be treated as a literal string in the path, and `getRedirectPath` will not accept parameters for it.

fix

Ensure `getParam()` is assigned as the value to any route property that should represent a dynamic segment (e.g., `uuid: getParam<UserParams>()`).

affects: >=1.0.0

gotchaWhen using `getRedirectPath`, ensure that all dynamic parameters for the path segment you are trying to construct are provided in the argument object. Missing parameters will result in parts of the path being undefined or incorrect.

fix

Pass an object to `getRedirectPath` containing all necessary dynamic keys and their corresponding values, matching the `getParam` definitions higher up the route chain.

affects: >=1.0.0

Errors

Common errors & fixes

TS2345: Argument of type '{ home: { loans: {}; user: { uuid: Function; ... }; }; preview: {}; }' is not assignable to parameter of type 'string'.

Trying to pass a route tree object or a specific route node object directly where a string path is expected (e.g., to a `Link` component's `to` prop).

fix

Call the appropriate path generation function, such as `.getRoutePath()` for static paths or `.getRedirectPath({ param: value })` for dynamic paths, on the route node.

TypeError: routes.home.user.uuid.getRedirectPath is not a function

Attempting to call `getRedirectPath` directly on a route segment that itself is defined by `getParam()`. `getParam` makes the *parent* able to generate a path with parameters, or makes the node itself a 'param-accepting' function, not a direct object with methods in the returned tree.

fix

For dynamic routes defined with `getParam`, `getRedirectPath` is typically called on a *parent* node, or if `getParam` is at the end, it's the function that takes the params. Re-evaluate where dynamic parameters are expected and call `getRedirectPath` at the correct level, passing all required parameters for that path segment.

Property 'uuid' does not exist on type '{ balances: { getRoutePath: Function; getRedirectPath: Function; getElementKey: Function; }; security: { '2fa': {}; sms: {}; getRoutePath: Function; ... }; getRoutePath: Function; ... }'.

Incorrectly attempting to access a dynamic route segment (e.g., `routes.home.user.uuid`) as a fixed property after it has been defined using `getParam`.

fix

The `uuid` property, when defined with `getParam`, becomes the entry point for dynamically constructing the path. You should call `getRedirectPath` on the parent (`routes.home.user`) or a descendant (`routes.home.user.uuid.security['2fa']`) and provide the `uuid` value in the parameters object.

Upgrade

Version history

1.0.3latest on npm

Audit

Dependencies

No dependency data recorded yet.

Agent activity

7 hits · last 30 days

node

OpenAI (training)

Resources

githubhttps://github.com/fullstack-development/build-route-tree ↗

packagehttps://www.npmjs.com/package/build-route-tree ↗