vuejs/vue-router · warning

missing param for ${routeMsg}: ${e.message}

Error message

missing param for ${routeMsg}: ${e.message}

What it means

fillParams interpolates route params into a path-to-regexp compiled path. When a required named param in the route's path pattern (e.g. /user/:id) is missing from the params object, the underlying path-to-regexp filler throws, and this warning reports the missing param along with routeMsg identifying which path/route failed. The function catches the error and returns an empty string, so the resulting path will be incomplete.

Source

Thrown at src/util/params.js:30

  path: string,
  params: ?Object,
  routeMsg: string
): string {
  params = params || {}
  try {
    const filler =
      regexpCompileCache[path] ||
      (regexpCompileCache[path] = Regexp.compile(path))

    // Fix #2505 resolving asterisk routes { name: 'not-found', params: { pathMatch: '/not-found' }}
    // and fix #3106 so that you can work with location descriptor object having params.pathMatch equal to empty string
    if (typeof params.pathMatch === 'string') params[0] = params.pathMatch

    return filler(params, { pretty: true })
  } catch (e) {
    if (process.env.NODE_ENV !== 'production') {
      // Fix #3072 no warn if `pathMatch` is string
      warn(typeof params.pathMatch === 'string', `missing param for ${routeMsg}: ${e.message}`)
    }
    return ''
  } finally {
    // delete the 0 if it was added
    delete params[0]
  }
}

View on GitHub (pinned to 680ccc68c5)

Solutions

  1. Supply all required params in the location object: router.push({ name: 'user', params: { id: 1 } }).
  2. Check route record path definitions and match param keys exactly (case-sensitive) with what you pass.
  3. Make params optional in the route pattern with repeated/optional segments (path: '/user/:id?') only when truly optional — note a warning is still emitted unless handled.
  4. Validate params object before navigation (all keys present and non-null), or fall back to a default route if data is missing.

Example fix

// before
router.push({ name: 'user', params: { userId: 1 } }) // route path is /user/:id
// after
router.push({ name: 'user', params: { id: 1 } })
Defensive patterns

Strategy: validation

Validate before calling

function hasRequiredParams (routePath, params) {
  const required = (routePath.match(/:[^/?]+/g) || []).map(s => s.slice(1).replace(/\(.*\)$/, ''))
  return required.every(k => params && params[k] !== undefined && params[k] !== null && params[k] !== '')
}
// before navigating to a named route:
// if (!hasRequiredParams('/user/:id', { id })) return fallback()

Type guard

function isCompleteParams (routePath) {
  const required = (routePath.match(/:[^/?]+/g) || []).map(s => s.slice(1))
  return (p) => required.every(k => typeof p?.[k] === 'string' || typeof p?.[k] === 'number')
}

Try / catch

try {
  router.push({ name: 'user', params: { id } })
} catch (e) {
  console.error('navigation failed:', e.message)
  router.push({ name: 'not-found' })
}

Prevention

When it happens

Trigger: Calling router.push({ name: 'user', params: { } }) or omitting a required param when the named route's path contains :param segments — e.g. route path '/user/:id' resolved without params.id. Also triggered when resolving a path string via resolvePath/fillParams with an incomplete params object.

Common situations: Renaming a param in the route config (path changed from /user/:userId to /user/:id) but not updating all push calls; building URLs dynamically where a param can be undefined/null; typos in param keys (id vs ID); navigation to a parametrized route from data that is not yet loaded.

Related errors


AI-assisted analysis of vuejs/vue-router@680ccc68c5 (2026-09-02). Data as JSON: /api/errors/6eadae284f71280a. Report an issue: GitHub.