Document module / storiesof / mdx story formats #7498
Merged
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
This pull request is automatically deployed with Now. Latest deployment for this branch: https://monorepo-git-7440-module-format-docs.storybook.now.sh |
This was referenced Jul 20, 2019
tmeasday
approved these changes
Jul 22, 2019
| - a classic [storiesOf format](../../formats/storiesof-story-format/), which adds stories through Storybook's API. | ||
| - an experimental [MDX format](../../formats/mdx-story-format/), which mixes longform Markdown docs and JSX stories. | ||
|
|
||
| Since Module format is a new additon to Storybook, most Storybook examples you'll find in the wild are written in the legacy [storiesOf format](../stories-of-format/). |
There was a problem hiding this comment.
Suggested change
| Since Module format is a new additon to Storybook, most Storybook examples you'll find in the wild are written in the legacy [storiesOf format](../stories-of-format/). | |
| Since Module format is a new addition to Storybook, most Storybook examples you'll find in the wild are written in the legacy [storiesOf format](../stories-of-format/). |
| ``` | ||
|
|
||
| This will add stories in the storybook like this: | ||
| The `load` function may be called multiple times to load stories from different locations. |
| title: 'Module Story Format' | ||
| --- | ||
|
|
||
| Module story format is the recommended way to [write stories](../../basics/writing-stories/) since Storybook 5.2. |
There was a problem hiding this comment.
Suggested change
| Module story format is the recommended way to [write stories](../../basics/writing-stories/) since Storybook 5.2. | |
| The module story format is the recommended way to [write stories](../../basics/writing-stories/) since Storybook 5.2. |
|
|
||
| Module story format is the recommended way to [write stories](../../basics/writing-stories/) since Storybook 5.2. | ||
|
|
||
| It's called "module" format because the stories and component metadata are defined as ES6 modules. Every Module story file consists of a required default export and one or more named exports. |
There was a problem hiding this comment.
Suggested change
| It's called "module" format because the stories and component metadata are defined as ES6 modules. Every Module story file consists of a required default export and one or more named exports. | |
| It's called "module" format because the stories and component metadata are defined as ES6 modules. Every module story file consists of a required default export and one or more named exports. |
|
|
||
| It's called "module" format because the stories and component metadata are defined as ES6 modules. Every Module story file consists of a required default export and one or more named exports. | ||
|
|
||
| Module format is supported in all frameworks except React Native, where you should use the [storiesOf format](../storiesof-story-format) instead. |
There was a problem hiding this comment.
Suggested change
| Module format is supported in all frameworks except React Native, where you should use the [storiesOf format](../storiesof-story-format) instead. | |
| The module format is supported in all frameworks except React Native, where you should use the [storiesOf format](../storiesof-story-format) instead. |
| )); | ||
| ``` | ||
|
|
||
| The string argument to `storiesOF` is the component title. IF you pass a string like `'Widgets|Button/Button'` it can also be used to position your component's story within [Storybook's story hierarchy](../../writing-stories/#story-hierarchy). |
There was a problem hiding this comment.
Suggested change
| The string argument to `storiesOF` is the component title. IF you pass a string like `'Widgets|Button/Button'` it can also be used to position your component's story within [Storybook's story hierarchy](../../writing-stories/#story-hierarchy). | |
| The string argument to `storiesOf` is the component title. IF you pass a string like `'Widgets|Button/Button'` it can also be used to position your component's story within [Storybook's story hierarchy](../../writing-stories/#story-hierarchy). |
| require('../stories/Bar.stories.js'); | ||
| } | ||
|
|
||
| configure(loadStories, module); |
There was a problem hiding this comment.
Suggested change
| configure(loadStories, module); | |
| load(loadStories, module); |
?
1 task
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Issue: #7440
What I did