Upgrade vue-router 4.3.0 → 5.2.0
- Dominant language
- JavaScript
- Stars
- 400
- Forks
- 89
- Avg merge
- 1d 21h
- Merged PRs (30d)
- 146
Description
# Upgrade vue-router 4.3.0 → 5.2.0 (major)
Dependabot PR #7857. Runtime dependency (`dependencies`, `^4.2.5`); the app router — `createRouter` in `frontend/src/routes.js`, plus `useRouter`/`useRoute` across `frontend/src/`. Pulled out of the weekly Dependabot slot per the major-version process — needs an owner and verification, not a batch merge.
## Compatibility pre-check
- Vue peer `^3.5.34 || ^4.0.0` vs installed `vue@3.5.38` — ✅
- Extra peers (`vite ^7.3.0 || ^8.0.0`, `pinia`, `@pinia/colada`, `@vue/compiler-sfc`) are all `optional: true` — for the merged file-based/typed-routes tooling we don't use; installed `vite@6.4.2` / `pinia@3.0.4` unaffected — ✅
- No `engines` field on vue-router@5.2.0 — ✅
## Breaking changes to review
- v4→v5 is a "boring" release merging unplugin-vue-router into core; migration guide states no breaking changes for non-file-based users (source: v4-to-v5 migration guide).
- IIFE build no longer bundles `@vue/devtools-api` (v8) — only affects the standalone browser build, not bundled apps.
- 5.0.3: `next()`-callback guards emit deprecation warnings; `NavigationResult` deprecated in favor of `reroute(to)` (experimental APIs) — to confirm from changelog.
## To do before merge
- [ ] Verify routing/navigation still works — `createRouter` + `createWebHistory` in `frontend/src/routes.js`.
- [ ] Check `next()`-callback guards for new deprecation warnings: `beforeEach` in `routes.js`, and `beforeEnter` guards `ensurePermission.ts` / `ensureAdmin.ts`.
- [ ] Confirm lazy/dynamic route imports still resolve.
- [ ] Read the 5.x changelog / migration notes and reconcile with our usage.
## Refs
- Branch: `dependabot/npm_and_yarn/vue-router-5.2.0`
- PR: #7857
- Upstream: https://github.com/vuejs/router/releases and https://router.vuejs.org/guide/migration/v4-to-v5.html
Contributor guide
Research direction
Start with the existing Dependabot branch and PR #7857, then inspect createRouter and createWebHistory in frontend/src/routes.js. Review useRouter/useRoute usage across frontend/src/, including beforeEach in routes.js and beforeEnter guards in ensurePermission.ts and ensureAdmin.ts, and read the linked 4-to-5 migration guide and changelog. Done means routing, navigation, guards, lazy imports, and the listed compatibility checks work without unexpected warnings.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Refactor
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 32/100