Universal File-Based Router - A framework-agnostic file-based routing solution for modern web applications.
ufbr automatically generates routes from your file structure, eliminating the need for manual route configuration. Perfect for building single-page applications with intuitive file organization.
- 📁 File-Based Routing - Routes automatically generated from your file structure
- ⚡ Sync & Async Components - Support for both synchronous and asynchronous component loading
- 🔗 Nested Routes - Build hierarchical route structures effortlessly
- 🎯 Dynamic Routes - Create parameterized routes with
[param]syntax - 🎨 Framework Agnostic - Works with Preact, Solid, Ziko, Vue, and more
npm install ufbrimport { createFileBasedRouter } from 'ufbr/[FRAMEWORK]'
createFileBasedRouter({
pages: import.meta.glob('./pages/**/*.[jsx,js]'),
target: document.body
})| Tech | Stackblitz Link |
|---|---|
| Van | |
| Preact | |
| Solid | |
| Vue | |
| Svelte |
Options:
pages(object) - Result ofimport.meta.glob()pattern with all page componentstarget(Element) - DOM element where the router will render components
pages/
├── index.[extension] → /
├── about.[extension] → /about
├── blog/
│ ├── index.[extension] → /blog
│ └── [id].[extension] → /blog/:id
└── user/
└── [name].[extension] → /user/:name
MIT