Netlify live edit

I can’t get the visual editor to fully work with netlify.

With that I mean you click on an item and it opens up for editing, or move around things and immediately see the live result.

It works everywhere, e.g. zeit.co / vercel or locally.
Any ideas what could be wrong?

Hello Tobias,

you need to build the page as a SPA instead of a static page. You can find more about that in the documentation of Nuxt:

Hey @tschmidt23 and @Hannes
I’m rebuilding the Storyblok nuxt demo app to use the new Nuxt static generation, as well as move onto Tailwind rather than use Bootstrap.
I had a lot of issues when trying to get the editor working with the nuxt demo in a way that I couldn’t say it was ready to use as a base for production.

  • Full Static generation. Super speedy load times
  • “Non-static” in page editing on the same site when loaded from storyblok
  • Content editing with navigation
  • Edit mode validation with updating token

Look for deeja/storyblok-nuxt-starterkit on github if you’re intested in that

1 Like

Hello Daniel,

thanks a lot for sharing that with us! You can also enter in contact with other developers of our community on Discord if you’re not already there:

Hello,

I want to follow up on this topic as I had to figure out the same problem while setting up my Nuxt app deployed on Netlify as a static site.

I wanted contributors have the same experience than in dev mode using the Storyblok preview with working live edit.

The only way I found to make it work is deploying a parallel dev server using Heroku, so that I can use it as a preview URL for contributors instead of localhost.

Though, I think it’s a bit complicated.

I know Nuxt released a preview mode for static sites.

I try to use it adding the ?preview=true at the end of the storyblok preview netlify url but it’s not working.

If you guy ever have a clever solution, I’d be interested to know about it.

Btw, I really love the whole Storyblok experience, keep up the good work! :ok_hand:

Hello lansolo99,

I think that there should already are some people on our Discord server who have experiences with that topic. Maybe you get some information there when you ask in the Nuxtjs channel.

Hi @Hannes , thanks for your answer.

I already browsed all the threads on Discord related on this issue, and the only solution I found from fellows is to deploy another app (preferably a SPA instead of a dev app as I suggested) at least for the time being.

I tested it successfully with a dev server on Heroku and also as a SPA on Netlify.
For the last one, we should create another preview branch with a different build command thanks to the Netlify deploy context.

I will keep this approach but I would prefer of course having something working directly on my static deployment.