search

storyblok / storyblok-vue

Vue.js SDK for Storyblok CMS
MIT License
92 stars 20 forks source link

Does it support server-side rendering? #3

Closed Knovour closed 6 years ago

Knovour commented 6 years ago

I'm trying to use storyblok in my Nuxt.js project. But it shows window is not defined.

Is there any plan to support server-side render or I just missed something ?

DominikAngerer commented 6 years ago

Hey @Knovour server-side rendering can definitely be achieved since Storyblok only provides JSON via an API.

I guess we can add a simple check for window to allow this plugin to be used with server-side rendering as well. This plugin actually only helps you to easily add the information from the HTML comments (which are shipped in the draft JSON) in combination with the JavaScript bridge to be used as reference to allow the instant editing.

I'll do some tests and release a new version if everything works as expected, btw. currently working on a Demo & Blogpost for Nuxt.js which should be ready next week!

Knovour commented 6 years ago

Thank you

Is there a way to let Vue to call content from express or koa and still editable?

DominikAngerer commented 6 years ago

Absolutely - the editing doesn’t happen directly in your website it only happens in the sidebar in Storyblok.

I‘ve just finished a demo with jekyll & metalsmith - next to go is nuxtjs!

DominikAngerer commented 6 years ago

Hey @Knovour you can now have a look at https://github.com/storyblok/nuxtjs for SSR with Vue & Nuxt. Blog post is on its way.

Knovour commented 6 years ago

Thank you, I will try it on my project these days. And hope the storyblok-vue will support it too.

DominikAngerer commented 6 years ago

The Directive is directly included in the project itself - so this directive won't be used in the NuxtJs example, but you will still be able to use v-editable="blok"!

https://github.com/storyblok/nuxtjs/blob/master/plugins/storyblok_bridge.js

We've updated: https://github.com/storyblok/storyblok-nuxt to include this directive since it will only apply itself on the client side - to load content on the server you will now have context.app.$storyapi available in nuxt.

moltar commented 6 years ago

This directive does not work with SSR. To work with SSR it needs a custom SSR-specific implementation.

More info here: https://github.com/nuxt/nuxt.js/issues/898

DominikAngerer commented 6 years ago

The v-editable directive will be attached on the client side, even using nuxt-js, since this directive will/should not be initialized if you're out of the "draft" mode.