I tried to set the layouts directly in the component just like how it is done in Nuxtjs… then I just change the App.vue script...Here is how it looks like:

<script>
export default {
  computed: {
    layout() {
      if (this.$route.matched[0] && this.$route.matched[0].components.default.layout) {
        return this.$route.matched[0].components.default.layout + '-layout';
      }
      return (this.$route.meta.layout || 'app') + '-layout'
    },
  },
}
</script>

This way I can declare the layout in the component:

// About.vue
<script>
export default {
  layout: 'default',
}
</script>

Maybe you can comment if this is good or if there is a better solution or if there are downsides of this approach..

PS: I also created an issue in the Github repo(https://github.com/darkylmnx/Layout-system-with-vue-and-vue-router/issues/1)