What causes "${e.message}" in vuejs/vue-router?

Fix the malformed query string at the source (properly URL-encode values with encodeURIComponent / URLSearchParams).

${e.message}

Error message

${e.message}

What it means

resolveQuery delegates to parseQuery (default or a custom _parseQuery) inside a try/catch. If the parser throws on the raw query string, the error's message is surfaced via this warning and an empty parsed query ({}) is used so navigation can proceed. This is a dev-mode safety net around malformed query strings or a broken custom parser.

Source

Thrown at src/util/query.js:38

  } catch (err) {
    if (process.env.NODE_ENV !== 'production') {
      warn(false, `Error decoding "${str}". Leaving it intact.`)
    }
  }
  return str
}

export function resolveQuery (
  query: ?string,
  extraQuery: Dictionary<string> = {},
  _parseQuery: ?Function
): Dictionary<string> {
  const parse = _parseQuery || parseQuery
  let parsedQuery
  try {
    parsedQuery = parse(query || '')
  } catch (e) {
    process.env.NODE_ENV !== 'production' && warn(false, e.message)
    parsedQuery = {}
  }
  for (const key in extraQuery) {
    const value = extraQuery[key]
    parsedQuery[key] = Array.isArray(value)
      ? value.map(castQueryParamValue)
      : castQueryParamValue(value)
  }
  return parsedQuery
}

const castQueryParamValue = value => (value == null || typeof value === 'object' ? value : String(value))

function parseQuery (query: string): Dictionary<string> {
  const res = {}

  query = query.trim().replace(/^(\?|#|&)/, '')

View on GitHub (pinned to 680ccc68c5)

Solutions

Fix the malformed query string at the source (properly URL-encode values with encodeURIComponent / URLSearchParams).
Make the custom _parseQuery never throw: wrap its internals in try/catch and return a partial/partial object instead.
Validate/sanitize location.query strings before passing them to router.push/resolve.
Upgrade vue-router if the throwing parser was a known fixed bug; otherwise add an integration test for the offending input.

Example fix

// before
function _parseQuery (query) { return strictParse(query) } // may throw
// after
function _parseQuery (query) {
  try { return strictParse(query) } catch (e) { return {} }
}

Defensive patterns

Strategy: try-catch

Validate before calling

function safeQuery (raw) {
  try { return new URLSearchParams(raw.startsWith('?') ? raw.slice(1) : raw).toString() } catch (e) { return '' }
}

Try / catch

try {
  await router.push({ path: '/x', query: parsedQuery })
} catch (e) {
  console.warn('query parsing failed:', e.message)
  await router.push({ path: '/x' })
}

Prevention

If supplying a custom parseQuery, make it throw-proof: wrap parsing in try/catch and return a partial object.
Test your custom parser against edge inputs: 'a=%', '=v', 'a', '&', '%E0%A4'.
Use URLSearchParams as a robust baseline parser instead of hand-rolled splitting.
Keep the parser signature/behavior aligned with the vue-router version in use.

When it happens

Trigger: Parsing a query string that makes parseQuery throw — in the default parser this typically happens when decode throws on invalid percent-encoding that propagates (custom parsers may throw for any reason), or supplying a faulty _parseQuery implementation to routes/resolveQuery that raises on edge-case input.

Common situations: Custom parseQuery replacements (used for query param serialization customization) that throw on unusual input like 'a=%' or keys without '='; malformed URLs from external sources; library upgrades where a custom parser's assumptions no longer hold.

Related errors

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