Order of beforeResolve vs beforeMount

[MetRonnie]

I'm upgrading an app from Vue 2 to 3 and came across a problem due to an apparent change in the order of the router beforeResolve() global navigation guard and the component beforeMount() lifecycle hook.

In vue 2 and vue-router 3, the order was:

1. router.beforeEach()
2. router.beforeResolve()
3. component.beforeMount()

Whereas in vue 3 and vue-router 4 the order is:

1. router.beforeEach()
2. component.beforeMount()
3. router.beforeResolve()

(I have determined this order by adding breakpoints in each.)

This change does not seem to be documented in the upgrade guide, or at least I couldn't find it anywhere.

[posva]

This is because Routing Lifecycle and Component Lifecycle are independent. Callbacks passed to hooks should therefore also be independent and not rely on the order.