Continuing on from the post about versioned Storybook releases, I hit upon a simple problem: how do I fix a bug in previously released style guides? What do I mean by that? Well:
- Let’s say we have 10 versions of our style guide released as static Storybook builds.
- These builds all use an addon (the versions one in our case).
- That the addon has a bug, which we have now fixed.
- That’s all very nice and we can now release a new version of our style guide with includes the addon with the fix.
- But what about the rest of the published guides with the buggy addon?
On the face of it, it looks like we’d have to go back and rebuild every single version. Luckily, that is not the case. When you create a static Storybook build, you end up with something like this:
What you’re getting in that build is, first the
index.html which will load your style guide. That loads the
static/manager.<hash>.bundle.js which is the main storybook interface, which in turns uses the
iframe.html to display your stories. The stories are in
As such, what we can do is replace
static/manager... and that will have any updates we may have done in the packages and addons. However, since the configuration (what goes in
.storybook/config.js) is bundled with the stories in the
preview file, we cannot make any changes of that sort.
Overall, a nice thing to know as we can now retrofit updates to storybook and its addons without having to checkout and rebuild each older version of our style guide. Obviously there is the caveat of making changes to an addon that are incompatible with the stories, plus the usual dangers of retrofitting stuff to released software. But it can still be helpful to know all the above, when it comes to releasing bug fixes to our style guide. Hope this helps!