The @nujek/storyblok packages will install some useful nuxt modules to quickstart your project. This will help your development workflow.


yarn add -D @nujek/storyblok


const storyblokConfig = {
    accessToken: process.env.SB_CLIENT_ACCESS_TOKEN, #  <- here we will use the SB Token from the .env file.
    cacheProvider: 'memory',

export default {
  buildModules: [
      '@nujek/storyblok', { storyblokConfig: config, debug: true }


This is the official storyblok nuxt.js module to connect your app with storyblok cms.

Additionally it will inject $storyapi object which allows you to fetch stories e.g. from storyblok.

For listening to Visual Editor events you will need to use $storybridge which is documented here.


Vue.js plugin for rendering the rich-text content.

<SbRichtext :text="content" class="prose lg:prose-lg" />

Component: <SbRichtext/>

Package: @marvr/storyblok-rich-text-vue-renderer

Docs: rich-text-renderer Nuxtjs


Instead of $storyapi you could use nuxt-storyblok-queries. Which gives us a nice api to fetch data from storyblok.

Starting with version @nujek/storyblok version 0.0.104 we decided to remove nuxt-storyblok-queries from this package. It brings up too much confusion if we have two apis connected to storyblok. $storyblok (nuxt-storyblok-queries) and $storyapi (storyblok-nuxt)

Hint: This is a slightly modified version of nuxt-storyblok-queries module which has more features and support for storyblok management api

  <!-- Your template -->

export default {
  async asyncData({ $storyblok }) {
    const story = await $storyblok.getCurrentStory()

    return {