vuejs/devtools-v6 · warning

[Vue Devtools] No routes found in router

Error message

[Vue Devtools] No routes found in router

What it means

The Vue Router inspector for Vue 2 apps builds its tree from `router.options.routes`. When a router instance has no `routes` in its options (e.g. created with addRoute-only or an unusual config), the inspector logs this warning with the router options and shows an empty tree. It indicates the inspector cannot render the route table.

Source

Thrown at packages/app-backend-vue2/src/plugin.ts:67

    if (app.$router) {
      const router = app.$router

      // Inspector

      api.addInspector({
        id: ROUTER_INSPECTOR_ID,
        label: 'Routes',
        icon: 'book',
        treeFilterPlaceholder: 'Search routes',
      })

      api.on.getInspectorTree((payload) => {
        if (payload.inspectorId === ROUTER_INSPECTOR_ID) {
          if (router.options.routes) {
            payload.rootNodes = router.options.routes.map(route => formatRouteNode(router, route, '', payload.filter)).filter(Boolean)
          }
          else {
            console.warn(`[Vue Devtools] No routes found in router`, router.options)
          }
        }
      })

      api.on.getInspectorState((payload) => {
        if (payload.inspectorId === ROUTER_INSPECTOR_ID) {
          const route = router.matcher.getRoutes().find(r => getPathId(r) === payload.nodeId)
          if (route) {
            payload.state = {
              options: formatRouteData(route),
            }
          }
        }
      })

      // Timeline

      api.addTimelineLayer({

View on GitHub (pinned to dd2ab5d427)

Solutions

  1. Pass a `routes` array to the VueRouter constructor so the static options always exist.
  2. If routes are dynamic, seed the router with a minimal routes array and keep addRoute entries mirrored in options, or accept an empty inspector tree.
  3. Inspect the logged `router.options` in the console to see what the router actually received and fix the config source.
  4. Update vue-router/devtools packages — newer versions may fall back to router.getRoutes().

Example fix

// before
const router = new VueRouter() // no routes option
router.addRoute({ path: '/a', component: A })

// after
const router = new VueRouter({ routes: [{ path: '/a', component: A }] })
Defensive patterns

Strategy: validation

Validate before calling

if (!router.options?.routes?.length) {
  console.warn('Router created without static routes; inspector tree will be empty')
}

Type guard

function hasStaticRoutes(router) { return Array.isArray(router.options?.routes) && router.options.routes.length > 0 }

Prevention

When it happens

Trigger: getInspectorTree with inspectorId ROUTER_INSPECTOR_ID while the connected Vue 2 app's router was created without a `routes` array in `new VueRouter({...})` — routes added exclusively at runtime via addRoute, or options stripped by a custom router wrapper.

Common situations: Apps registering all routes dynamically at runtime; routers built by wrappers/meta-frameworks that omit the static routes array; config migration mistakes where the routes option was renamed or removed.

Related errors


AI-assisted analysis of vuejs/devtools-v6@dd2ab5d427 (2026-08-31). Data as JSON: /api/errors/490623a8733df77a. Report an issue: GitHub.