vue3-runtime-template SSR
I'm using Storyblok as a CMS on a Nuxt 3 site.
We have just upgraded from Nuxt 2 where we used vue-runtime-template to dynamically compile the rich text field HTML which includes Vue components by setting Nuxt to use the runtime compiler in the
On Nuxt 3, we set vue.runtimeCompiler to true in the config, and use vue3-runtime-template but this only tells Nuxt to use the runtime compiler on the client, not the server. The content is only rendered on the client, which defeats the object of using Nuxt in the first place, which is to get SSR.
This is blowing up the Storyblok editor when I change rich text fields because the VDom does not mach the real DOM and Vue can't cope in production, giving a
How do I get the vue3-riuntime-template to render on the server?
Related reading:
Runtime template package: https://www.npmjs.com/package/vue3-runtime-template
PR where runtime compiler option was originally added to Nuxt (in experimental): https://github.com/nuxt/framework/pull/4762
Storyblok rendering rich text in Nuxt docs: https://www.storyblok.com/faq/how-to-render-richtext-nuxt
Vue cannot read property insertBefore of null bug thread https://github.com/vuejs/core/issues/5657:tired_face:
We have just upgraded from Nuxt 2 where we used vue-runtime-template to dynamically compile the rich text field HTML which includes Vue components by setting Nuxt to use the runtime compiler in the
buildOn Nuxt 3, we set vue.runtimeCompiler to true in the config, and use vue3-runtime-template but this only tells Nuxt to use the runtime compiler on the client, not the server. The content is only rendered on the client, which defeats the object of using Nuxt in the first place, which is to get SSR.
This is blowing up the Storyblok editor when I change rich text fields because the VDom does not mach the real DOM and Vue can't cope in production, giving a
cannot read property insertBefore of nullHow do I get the vue3-riuntime-template to render on the server?
Related reading:
Runtime template package: https://www.npmjs.com/package/vue3-runtime-template
PR where runtime compiler option was originally added to Nuxt (in experimental): https://github.com/nuxt/framework/pull/4762
Storyblok rendering rich text in Nuxt docs: https://www.storyblok.com/faq/how-to-render-richtext-nuxt
Vue cannot read property insertBefore of null bug thread https://github.com/vuejs/core/issues/5657:tired_face:
npm
Create Vue 3 components by compiling templates on the fly. Latest version: 1.0.2, last published: 3 years ago. Start using vue3-runtime-template in your project by running
npm i vue3-runtime-templateGitHub
Linked issue
resolve nuxt/nuxt#13843
Type of change
Documentation (updates to the documentation or readme)
Bug fix (a non-breaking change that fixes an issue)
Enhancement (improving ...
Linked issueresolve nuxt/nuxt#13843
Type of change Documentation (updates to the documentation or readme) Bug fix (a non-breaking change that fixes an issue) Enhancement (improving ...GitHub
Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web. - Issues Β· vuejs/core
Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web. - Issues Β· vuejs/core
