---
layout: home
title: Vue Router Citadel — TypeScript Middleware & Route Guards
titleTemplate: false
description: Middleware-driven navigation control for Vue Router with outpost-based route guards. Layered, type-safe defense in ≤3 KB. No next() chains.

hero:
  name: Vue Router Citadel
  text: Structured navigation defense for Vue Router
  tagline: Place guards at the gates. Outposts along the way.
  image:
    src: /logo.svg
    alt: Vue Router Citadel
  actions:
    - theme: brand
      text: Get Started
      link: /guide/getting-started
    - theme: alt
      text: API Reference
      link: /api/
    - theme: alt
      text: GitHub
      link: https://github.com/Kassaila/vue-router-citadel
    - theme: alt
      text: "\u2B50 Star"
      link: https://github.com/Kassaila/vue-router-citadel/stargazers

features:
  - icon: "\U0001F6E1\uFE0F"
    title: Layered Navigation Defense
    details:
      Build multiple layers of route protection with priority-based navigation outposts. Global and
      route-scoped guards processed in order.
  - icon: "\U0001F4DC"
    title: Verdict System
    details:
      Return-based API — ALLOW, BLOCK, or redirect. No next() callback chains. Clean, predictable
      control flow.
  - icon: "\u26A1"
    title: Performance First
    details:
      '≤3 KB (minified + brotli). Outposts sorted at deploy time, not during navigation. Lazy loading
      support for code splitting heavy handlers.'
  - icon: "\U0001F50F"
    title: Type-Safe
    details:
      Full TypeScript support with declaration merging for outpost names. IDE autocomplete and
      compile-time validation.
  - icon: "\u23F1\uFE0F"
    title: Timeout Control
    details:
      Global and per-outpost timeout configuration. Custom timeout and error handlers with redirect or block
      verdicts.
  - icon: "\U0001F6E0\uFE0F"
    title: Vue DevTools Integration
    details:
      Custom inspector for viewing deployed outposts with tags, state panels, and runtime log level
      control.
---