regenrek/nujek

SbRichtext not rendering

Closed this issue · 3 comments

This is the fix:

Install packages:
yarn add --dev @marvr/storyblok-rich-text-vue-renderer
yarn add --dev @vue/composition-api

Use plugins:
composition-api.js

import Vue from 'vue'
import VueCompositionApi from '@vue/composition-api'

Vue.use(VueCompositionApi)

rich-text-renderer.js

import Vue from 'vue'
import VueRichTextRenderer from '@marvr/storyblok-rich-text-vue-renderer'

Vue.use(VueRichTextRenderer)

Register plugins:
nuxt.config.js

plugins: [
  { src: '~/plugins/composition-api.js' },
  { src: '~/plugins/rich-text-renderer.js' }
]

The plugin file composition-api shouldn't be necessary since we use nuxt composition api. Probably the richt text renderer isn't fully configured in v3. Will fix it in the next release.

One notice re: @marvr/storyblok-rich-text-vue-renderer package on Nuxt.js projects. Package itself use some modern ES syntax which is not yet supported on some browsers.

In order to make it working on older bowsers add line below in nuxt.config.js build property:
transpile: ['@marvr/storyblok-rich-text-vue-renderer']

This was already working before if you enable the rich text renderer plugin

  • nuxt.config.js
export default {
  nujekUi: {
   enableRichTextRenderer: true
  }
}

FIxed: If you set enableRichTextRenderer: true then the transpile is now done by the module. (>= Version 3.0.5).