Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve docs & assist with automatic story loading #746

Closed
ndelangen opened this issue Apr 4, 2017 · 11 comments
Closed

Improve docs & assist with automatic story loading #746

ndelangen opened this issue Apr 4, 2017 · 11 comments

Comments

@ndelangen
Copy link
Member

config.js requires you to require() all your stories, It's very common to see users use webpack to autorequire all stories using a pattern:

const regex = /.stories.js$/;
const context = require.context('../src/components', true, regex)
context.keys().map(context)

However this is undocumented. We should add this to the docs and possibly add a demo-project using this to refer to.

@travi
Copy link

travi commented Apr 4, 2017

not easy to find in the docs, but it is in there: https://getstorybook.io/docs/react-storybook/basics/writing-stories#loading-stories-dynamically

@danielduan
Copy link
Member

danielduan commented Apr 4, 2017

The code in the docs doesn't mention this but it also support nested folders too.

something like stories/buttons/cancelButton.stories.jsx would also work. makes organization a lot easier.

@travi
Copy link

travi commented Apr 4, 2017

yep, i keep my stories in nested folders, right next to the component. the details in the docs support that approach well

@ndelangen
Copy link
Member Author

@travi You say it was not easy to find, do you have any suggestions how to make it easier to find?

@danielduan
Copy link
Member

@ndelangen I feel like this should be a default that *.stories.js(x) be automatically included when you define a stories folder with an option to opt out or define custom filename regex in the config file.

@ndelangen
Copy link
Member Author

ndelangen commented Apr 4, 2017

yeah something to think about.

@travi
Copy link

travi commented Apr 4, 2017

@ndelangen good question. docs organization is never simple. the main thought i guess i have it that i would have expected these details under the "slow start guide" where it describes the config file since its more related to config than the stories themselves

@moimikey
Copy link
Contributor

moimikey commented Apr 5, 2017

i would appreciate for checking stor(ies|y). we use this pattern in our modules:

reducer.js
component.js
story.js

but at the same time, i don't believe storybook should do this by default. this seems more like an implementation detail.

@ndelangen
Copy link
Member Author

I could see us auto-loading all /.story.js$/ in the future.

@tmeasday
Copy link
Member

I could see us auto-loading all /.story.js$/ in the future.

I like this pattern because it is consistent with Jest.

@ndelangen
Copy link
Member Author

ndelangen commented May 10, 2017

I will close this and create a new issue dedicated to:

I could see us auto-loading all /.story.js$/ in the future.

done: #1013

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

5 participants