The Storybook for the
gitlab-org/gitlab project is available on our GitLab Pages site.
Storybook dependencies and configuration are located under the
To build and launch Storybook locally, in the root directory of the
Install Storybook dependencies:
Build the Storybook site:
Stories can be added for any Vue component in the
To add a story:
Create a new
.stories.jsfile in the same directory as the Vue component. The filename should have the same prefix as the Vue component.
vue_shared/ ├─ components/ │ ├─ sidebar │ | ├─ todo_toggle │ | | ├─ todo_button.vue │ │ | ├─ todo_button.stories.js
Write the story as per the official Storybook instructions
Notes: - Specify the
titlefield of the story as the component’s file path from the
vue_shared/components/sidebar/todo_toggle/todo_button. This will ensure the Storybook navigation maps closely to our internal directory structure.
GitLab’s Storybook uses MirajeJS to mock REST and GraphQL APIs. Storybook shares the MirajeJS server
with the frontend integration tests. You can find the MirajeJS
configuration files in