# vue-router-next [![release candidate](https://img.shields.io/npm/v/vue-router/next.svg)](https://www.npmjs.com/package/vue-router/v/next) [![CircleCI](https://badgen.net/circleci/github/vuejs/vue-router-next/master)](https://circleci.com/gh/vuejs/vue-router-next)

> This is the repository for Vue Router 4 (for Vue 3)

<h2 align="center">Supporting Vue Router</h2>

Vue Router is part of the Vue Ecosystem and is an MIT-licensed open source project with its ongoing development made possible entirely by the support of Sponsors. If you would like to become a sponsor, please consider:

- [Become a Sponsor on GitHub](https://github.com/sponsors/posva)
- [One-time donation via PayPal](https://paypal.me/posva)

<!-- <h3 align="center">Special Sponsors</h3> -->
<!--special start-->

<h3 align="center">Platinum Sponsors</h3>

<p align="center">

  <a href="https://www.finclip.com/#/home?from=vue" target="_blank" rel="noopener noreferrer">
    <picture>
      <source srcset="docs/public/sponsors/fincliplogo_white.svg" media="(prefers-color-scheme: dark)" height="96px" alt="Finogeeks" />
      <img src="docs/public/sponsors/fincliplogo_black_svg.svg" height="96px" alt="Finogeeks" />
    </picture>
  </a>

</p>

<h4 align="center">Gold Sponsors</h4>

<p align="center">

  <a href="https://passionatepeople.io" target="_blank" rel="noopener noreferrer">
    <picture>
      <source srcset="docs/public/sponsors/passionate-people-dark.png" media="(prefers-color-scheme: dark)" height="72px" alt="Passionate People" />
      <img src="docs/public/sponsors/passionate-people-light.png" height="72px" alt="Passionate People" />
    </picture>
  </a>

  <a href="https://vuetifyjs.com" target="_blank" rel="noopener noreferrer">
    <img src="https://cdn.vuetifyjs.com/docs/images/logos/vuetify-logo-light-text.svg" alt="Vuetify" height="72px">
  </a>

  <a href="https://vuejobs.com/?utm_source=vuerouter&utm_campaign=sponsor" target="_blank" rel="noopener noreferrer">
    <img src="docs/public/sponsors/vuejobs.png" height="72px" alt="VueJobs">
  </a>
</p>

<h4 align="center">Silver Sponsors</h4>

<p align="center">
  <a href="https://www.vuemastery.com" target="_blank" rel="noopener noreferrer">
    <img src="https://www.vuemastery.com/images/vuemastery.svg" height="42px" alt="Vue Mastery">
  </a>

  <a href="https://birdeatsbug.com/?utm_source=vuerouter&utm_medium=sponsor&utm_campaign=silver" target="_blank" rel="noopener noreferrer">
    <img src="https://static.birdeatsbug.com/general/bird-logotype-150x27.svg" alt="Bird Eats bug" height="42px">
  </a>
</p>

<h4 align="center">Bronze Sponsors</h4>

<p align="center">
  <a href="https://storyblok.com" target="_blank" rel="noopener noreferrer">
    <img src="https://a.storyblok.com/f/51376/3856x824/fea44d52a9/colored-full.png" alt="Storyblok" height="32px">
  </a>

  <a href="https://nuxtjs.org" target="_blank" rel="noopener noreferrer">
    <img src="https://nuxtjs.org/design-kit/colored-white-text.svg" alt="NuxtJS" height="26px">
  </a>
</p>

---

Get started with the [documentation](https://next.router.vuejs.org).

## Quickstart

- Via CDN: `<script src="https://unpkg.com/vue-router@4"></script>`
- In-browser playground on [CodeSandbox](https://codesandbox.io/s/vue-router-4-reproduction-hb9lh)
- Add it to an existing Vue Project:
  ```bash
  npm install vue-router@4
  ```

## Changes from Vue Router 3

Please consult the [Migration Guide](https://next.router.vuejs.org/guide/migration/).

## Contributing

See [Contributing Guide](https://github.com/vuejs/vue-router-next/blob/master/.github/contributing.md).

## Special Thanks

<a href="https://www.browserstack.com">
  <img src="https://github.com/vuejs/vue-router/raw/dev/assets/browserstack-logo-600x315.png" height="80" title="BrowserStack Logo" alt="BrowserStack Logo" />
</a>

Special thanks to [BrowserStack](https://www.browserstack.com) for letting the maintainers use their service to debug browser specific issues.