unplugin-vue-router

Zero-config File based type safe Routing

This build-time plugin simplifies your routing setup and makes it safer and easier to use thanks to TypeScript.

⚠️ This package is still experimental. If you found any issue, flow, or have ideas to improve it, please, open an issue.

Install

npm i unplugin-vue-router

Vite

// vite.config.ts
import VueRouter from 'unplugin-vue-router/vite'

export default defineConfig({
  plugins: [
    VueRouter({
      /* options */
    }),
  ],
})

Example: playground/

Rollup

// rollup.config.js
import VueRouter from 'unplugin-vue-router/rollup'

export default {
  plugins: [
    VueRouter({
      /* options */
    }),
  ],
}

Webpack

// webpack.config.js
module.exports = {
  /* ... */
  plugins: [
    require('unplugin-vue-router/webpack')({
      /* options */
    }),
  ],
}

Nuxt

// nuxt.config.js
export default {
  buildModules: [
    [
      'unplugin-vue-router/nuxt',
      {
        /* options */
      },
    ],
  ],
}

This module works for both Nuxt 2 and Nuxt Vite

Vue CLI

// vue.config.js
module.exports = {
  configureWebpack: {
    plugins: [
      require('unplugin-vue-router/webpack')({
        /* options */
      }),
    ],
  },
}

Rationale

This project idea came from trying to type the router directly using Typescript, finding it out it's not fast enough to be pleasant to use and recurring to build-based tools, taking some Inspiration from other projects like:

Nuxt - The Vue.js Framework
vite-plugin-pages - Framework agnostic file based routing
Typed Router for Nuxt - A module to add typed routing to Nuxt

License

MIT