unr / nuxt-typed-router

🚦Provide autocompletion for routes paths, names and params in Nuxt apps

---

⚠️ Nuxt 3.4 introduced a breaking change in its router output.
Install a version superior > v3.1.4 of nuxt-typed-router if you're using this Nuxt version

---

Provide a type safe router to Nuxt with auto-generated typed definitions for route path, name and params

• Supports all programmatic navigation utils (NuxtLink, useRouter, navigateTo, useRoute, useLocalePath, etc...)
• Supports optional params and catchAll routes
• Autocompletes routes paths, names and params
• Throw error if route path is invalid
• Out of the box i18n support
• Supports routes extended by config and modules

Documentation

Play with it

Demo repo 🧪 : nuxt-typed-router-demo

Cool video about it from LearnVue!

Compatibility:

• Nuxt 3
• Nuxt 2 (via nuxt2 branch)

Quick start

For Nuxt 3

yarn add -D nuxt-typed-router
# or
npm install -D nuxt-typed-router
# or
pnpm install -D nuxt-typed-router

Nuxt 2 legacy (not maintained)

Nuxt 2 version is no longer maintained, but still available in nuxt2 branch It only has route name autocomplete functionnality

yarn add -D nuxt-typed-router@legacy
# or
npm install -D nuxt-typed-router@legacy

Configuration

Register the module in the nuxt.config.ts, done!

export default defineNuxtConfig({
  modules: ['nuxt-typed-router'],
});

Development

1. Clone this repository
2. Install dependencies using pnpm
3. Build project for local tests pnpm run test
4. Start dev playground pnpm run prepack && pnpm run dev
5. Build project for deploy pnpm prepack

📑 License

MIT License