Router
Declarative Routing for SignalX
A powerful, type-safe router with SSR support, route guards, lazy loading, and seamless integration with SignalX's reactive system.
Prerequisites
Before diving in, make sure you're familiar with: SignalX Core basics, Components
Features
Declarative Routes
Define routes with a clean, declarative API. Nested routes and dynamic parameters supported.
Route Guards
Protect routes with authentication guards, redirects, and data loading hooks.
Lazy Loading
Code-split your routes automatically for optimal bundle sizes and faster loads.
SSR & Static Hosting
Full server-side rendering support with seamless hydration. Hash-based routing for static hosts.
Type-Safe Links
RouterLink component with type-safe paths and automatic active states.
Reactive Navigation
Access route params and query strings as reactive signals.
Quick Example
See how easy it is to get started
import { createRouter, RouterView, RouterLink } from '@sigx/router';
const router = createRouter({
routes: [
{ path: '/', component: Home },
{ path: '/users/:id', component: UserProfile },
{
path: '/admin',
component: AdminLayout,
guard: () => isAuthenticated(),
children: [
{ path: 'dashboard', component: Dashboard },
],
},
],
});
// In your app
<RouterLink to="/users/123">View User</RouterLink>
<RouterView />