Pre-rendered / SSR (server side rendered) stories

This topic has already occurred several times without any proper solutions or discussions on how to implement this in the future. https://github.com/storybookjs/storybook/issues/8009 https://github.com/storybookjs/storybook/issues/828 https://github.com/storybookjs/storybook/issues/4271

I think there is definitely a need for server side rendered stories and with some changes to the API it may be possible to create a plugin. We already created a working SSR configuration for storybook (5.xx) (react) but it uses some private functions to create a working webpack configuration. Many corners were cut to get this thing running.

https://github.com/goodhood-eu/goodhood/tree/5f0342b36186f9eccf36930d4cde53626a579b8b/.storybook

In short, it works like this:

• start-storybook --preview-url=/ssr-iframe
• .storybook/middleware.js registers a custom SSR middleware
• SSR middleware injects a custom webpackDevMiddleware and listens to requests to /ssr-iframe
• On GET /ssr-iframe we grab the compiled prerender bundle from webpack and render the requested story
• ssr-iframe client side js kicks in and hydrates prerender https://github.com/goodhood-eu/goodhood/blob/5f0342b36186f9eccf36930d4cde53626a579b8b/.storybook/ssr/src/index.jsx#L14

This part only uses public APIs.

The difficult part is to setup a working webpack config. To be able to do this, we access some storybook internals. https://github.com/goodhood-eu/goodhood/blob/5f0342b36186f9eccf36930d4cde53626a579b8b/.storybook/ssr/webpack.config.js#L1

Needed public API for a plugin like this:

• Set previewUrl in main.js or somewhere other than CLI args
• Get preview webpack config (don’t think there is a way around patching it)

Would you accept a PR solving this?