Issue: 2999

Get component's options in plugin by routeRecord failed

[issue link]

I am trying to use vue-kindergarten as a plugin not as the way shown at their official site which the beforeEach hook is set in the router middleware.

The context is that I set perimeters in each page and would like to get this option before the router routes to the target page. When I tried get the options from the to route by:

const { options } = routerRecord.components.default;
const { perimeters } = options;

I found that the first routing from the client-side, the routerRecord.components.default will get a webpack generated function that returns a Promise. And will get a VueComponent constructor after the first call. The first value is as the following:

var _7ff4353d = function _7ff4353d() {
  return import('../pages/news.vue' /* webpackChunkName: "pages/news" */).then(function (m) {
    return m.default || m;

My guess is that during the first call to routerRecord.components.default, vue components are still not resolved and is dynamically generated after that. If this is right, I am wondering if there is a way to get the page specific options from the beforeEach hook in a plugin without initiating the VueComponent in advance?

Seems like the beforeEach hook should still put in the middleware just like the official example shows in this case. LOL


This question is available on Nuxt.js community (#c2599)