Storybook: Add story funtion breaks HMR

Created on 19 Jun 2019  路  3Comments  路  Source: storybookjs/storybook

Hi,
I'm trying to create my own wrapper to create stories, to save some redundant code.
every time I use my createStory, the story loads fine but the HMR breaks and I get this warning in the console

I tested everything, even dumbed down versions, still doesnt work

lets say I have a function:

/** createStory*/ export default (section) => storiesOf(section, module)

and I try to use it in my story file

/** component.story.js */ createStory('my Story').add(...)

This will not get HMR, and I will get this error:

story with id v2-components--avatar-structures already exists in the store!
Perhaps you added the same story twice, or you have a name collision?
Story ids need to be unique -- ensure you aren't using the same names modolo url-sanitization.

now if I do this:
/** component.story.js */ storiesOf('My Story', module).add(...)

everything works fine.

can someone help?

using:
@storybook: 5.1.8
react: 16.8.6

core question / support

Most helpful comment

AFAIK you need module to be different for each storiesOf call, so you should pass it individually each time.

In 5.2 we'll be releasing a new story format where you can just export functions and just export stories as functions: https://github.com/storybookjs/storybook/pull/7110

All 3 comments

AFAIK you need module to be different for each storiesOf call, so you should pass it individually each time.

In 5.2 we'll be releasing a new story format where you can just export functions and just export stories as functions: https://github.com/storybookjs/storybook/pull/7110

so if I pass the module? would that work?

So, Adding module to the createStory function worked. Thanks!

Was this page helpful?
0 / 5 - 0 ratings