Storybook is a tool with countless shapes and configurations, and given that we give support to hundreds of people, it's very important to provide a minimal repo that can reproduce your issue/situation. Thanks for your effort! This will help us assist you better and faster.
And now, let's get to it!
We will be using codesandbox in these instructions, and you will need an account.
Select your template from the currently available list:
- Storybook React
- Storybook React Typescript
- Storybook Vue
- Storybook Angular
- Others to come..
You should already see storybook running:
You will see a prompt in the bottom right corner saying that you need to fork it in order to make changes. Go ahead and do it.
Now, let's suppose that you need to add some addons (we will configure the addon Docs in this example). For that, click on the add dependency
button on the left, and that will give you the option to add the dependencies you need, with any version available. Add all the necessary dependencies before moving to the next step.
This is the time to add the configurations for you addons, making changes to main.js
or adding files like preview.js
or manager.js
. Make the necessary changes for all addons before moving to the next step.
Files like main.js
are only processed once, when Storybook starts. If you make changes on such files, you need to restart Storybook. If you didn't, you may skip this step.
Click on the Server control panel on the left and then click to restart your server.
Now wait for Storybook to be restarted. Grab a coffee ☕️, this might take a minute or two.
After that is done, you might not see your changes in your Storybook. The reason is because the browser was not refreshed, so go ahead and refresh it by clicking at the button on the top left corner.
There you go! Now you should see the addons working with your configuration.
Thanks for concluding the steps! Now all you gotta do is share your template with us. This will allow us to quickly review your issue and also to fork your template to provide you a fix when applicable!
Thanks for sharing!