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
- Supply all required params in the location object: router.push({ name: 'user', params: { id: 1 } }).
- Check route record path definitions and match param keys exactly (case-sensitive) with what you pass.
- 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.
- 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
- Keep param keys in push calls in sync with route path definitions (extract names to constants).
- Never pass possibly-undefined values as params without a guard or default.
- Use TypeScript route param typings or generate push calls from route definitions.
- Log/validate params objects in navigation wrappers before calling router.push.
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
- relative params navigation requires a current route.
- props in "${route.path}" is a ${typeof config}, expecting an
- Duplicate param keys in route with path: "${path}"
- [vue-router]: Missing current instance. ${method}() must be
- [vue-router] ${message}
AI-assisted analysis of vuejs/vue-router@680ccc68c5 (2026-09-02).
Data as JSON: /api/errors/6eadae284f71280a.
Report an issue: GitHub.