Cannot display content from storyblok

[amjad-alarori]

Environment

• Operating System: Mac
• Node Version: v16.20.0
• Project Versions (all applicable): Vuestorefront 2
• Package Manager: yarn

Reproduction

i have generated a store using npx @vue-storefront/cli generate store and integrated this with a magento 2 and storyblok.

1- i added the module yarn add @vue-storefront/storyblok storyblok-vue
2- i added the integration of storyblok in the middlware.config.js file :
sb: { location: '@vue-storefront/storyblok/server', configuration: { token: 'MY_TOKEN', cacheProvider: 'memory', }, },
3- this in the nuxt.config.ts: modules: ['@vue-storefront/storyblok/nuxt']
4- and this in the nuxt module:
useRawSource: { dev: ['@vue-storefront/storyblok'], prod: ['@vue-storefront/storyblok'] }
5- and then i created a block on storyblok called Banner and filled this out with values
6- in cms/Banner.vue i pasted the corresponding banner component content
7- now if i go for /faq and try to paste this:

`

Loading content...

Something is wrong!

<script> import { onSSR } from '@vue-storefront/core' import { useContent } from '@vue-storefront/storyblok' // path to the component that you've just copied import RenderContent from '~/cms/RenderContent.vue' export default { components: { RenderContent }, setup() { const { search, content, loading, error } = useContent('unique-id') // get data onSSR(async () => { await search({ url: 'home-page' }) }) // return data return { content, loading, error, } } } </script>`

i get this error:

[0] ERROR [Vue warn]: Error in data(): "TypeError: Cannot read properties of undefined (reading 'has')" [0] [0] found in [0] [0] ---> <Pages/Faq.vue> at pages/Faq.vue [0] <Nuxt> [0] <DefaultLayout> at layouts/default.vue [0] <Root> [0]

Describe the bug

i have generated a store using npx @vue-storefront/cli generate store and integrated this with a magento 2 and storyblok.

1- i added the module yarn add @vue-storefront/storyblok storyblok-vue
2- i added the integration of storyblok in the middlware.config.js file :
sb: { location: '@vue-storefront/storyblok/server', configuration: { token: 'MY_TOKEN', cacheProvider: 'memory', }, },
3- this in the nuxt.config.ts: modules: ['@vue-storefront/storyblok/nuxt']
4- and this in the nuxt module:
useRawSource: { dev: ['@vue-storefront/storyblok'], prod: ['@vue-storefront/storyblok'] }
5- and then i created a block on storyblok called Banner and filled this out with values
6- in cms/Banner.vue i pasted the corresponding banner component content
7- now if i go for /faq and try to paste this:

`

Loading content...

Something is wrong!

<script> import { onSSR } from '@vue-storefront/core' import { useContent } from '@vue-storefront/storyblok' // path to the component that you've just copied import RenderContent from '~/cms/RenderContent.vue' export default { components: { RenderContent }, setup() { const { search, content, loading, error } = useContent('unique-id') // get data onSSR(async () => { await search({ url: 'home-page' }) }) // return data return { content, loading, error, } } } </script>`

i get this error:

[0] ERROR [Vue warn]: Error in data(): "TypeError: Cannot read properties of undefined (reading 'has')" [0] [0] found in [0] [0] ---> <Pages/Faq.vue> at pages/Faq.vue [0] <Nuxt> [0] <DefaultLayout> at layouts/default.vue [0] <Root> [0]

Additional context

No response

Logs

No response