App.vue support for bridge ?

[pi0]

We can support an alias of layouts/default.vue ~> App.vue to make bridge projects even closer to nuxt 3.

/cc @atinux Wdyt?

[atinux]

Not really sure about this since App is always applied for Nuxt 3.

We could patch Nuxt 2 App.js to use something like this.app instead of 'div' here: https://github.com/nuxt/nuxt.js/blob/dev/packages/vue-app/template/App.js#L46

But I am quite sure this will create plenty of issues 😬

[pi0]

What are breaking changes you think users would face when migrating App.vue (as layout in bridge) to App.vue in nuxt 3?

[atinux]

I think the usage will be different, I think that for Nuxt Bridge user they will have to use <slot> in order to display the layout/page (https://github.com/nuxt/nuxt.js/blob/dev/packages/vue-app/template/App.js#L73-L81).

Where in Nuxt 3 they will directly use <NuxtPage/> inside, but I think it may be worth to try 😀

[pi0]

Indeed usage will be different as nuxt 2 API is different (and bridge is attempting to only make it closer to nuxt 3)

We might try to auto-register a nuxt-3 compatible <NuxtPage> (as well as NuxtLayout component that can be used within App.vue.

This way users can progressively get closer to nuxt 3 without breaking changes of vue 3:

• Start migrating CSS from nuxt.config to App.vue
• Use the new layouts system with scoped slots and <NuxtLayout>

But indeed there might be unseen issues at least currently thinking of:

• We cannot combine bridge's App.vue with layouts/ !

[atinux]

I think that this is definitely something we should try anyway since it will ease the migration.

I just want to be more confident about the usage of NuxtPage with NuxtLayout when we start gathering feedback ☺️

[MartinX3]

Currently I use ln -s ../app.vue default.vue as a workaround.

[AndreyYolkin]

@atinux I tried today to reimplement basic version of app.vue, currently without <NuxtPage /> and <NuxtLayout />
https://github.com/AndreyYolkin/poc-appvue-module

This is done by addind extra templates: vueApp loader for both of builders and App.js template replacement. Thanks to flexibility we have now 🚀 I'll appreciate if you do a quick look at playground: https://codesandbox.io/s/github/AndreyYolkin/poc-appvue-module