Skip to content

Commit

Permalink
Update getstorybook instructions for SB4 release (gatsbyjs#9854)
Browse files Browse the repository at this point in the history
<!--
  Q. Which branch should I use for my pull request?
  A. Use `master` branch (probably).

  Q. Which branch if my change is a bug fix for Gatsby v1?
  A. In this case, you should use the `v1` branch

  Q. Which branch if I'm still not sure?
  A. Use `master` branch. Ask in the PR if you're not sure and a Gatsby maintainer will be happy to help :)

  Note: We will only accept bug fixes for Gatsby v1. New features should be added to Gatsby v2.

  Learn more about contributing: https://www.gatsbyjs.org/docs/how-to-contribute/
-->
  • Loading branch information
shilman authored and gpetrioli committed Jan 22, 2019
1 parent 4fc7e0e commit 75b04bb
Show file tree
Hide file tree
Showing 2 changed files with 12 additions and 3 deletions.
8 changes: 5 additions & 3 deletions docs/docs/visual-testing-with-storybook.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,14 +17,16 @@ To set up Storybook you need to install dependencies and do some custom configur
npm install -g @storybook/cli
```

Once the CLI is installed, the next step is to run the `getstorybook` command that is now available from the root directory of your Gatsby project.
Once the CLI is installed, the next step is to run the `sb init` command that is now available from the root directory of your Gatsby project.

```sh
cd my-awesome-gatsby-project
getstorybook
sb init
```

The `getstorybook` command will then bootstrap the basic config necessary to run Storybook for a React project. However, since this is for a Gatsby project, you need to update the default Storybook configuration a bit so that you don't get errors when trying to use Gatsby specific components inside of the stories.
> Note that if you're running a recent version of `npm` (5.2.0+) you can run the following single command instead: `npx -p @storybook/cli sb init`, which is the recommended method by Storybook. This doesn't install the CLI on your machine, thereby ensuring you're always running the latest version of the CLI.
The `sb init` command boostraps the basic config necessary to run Storybook for a React project. However, since this is for a Gatsby project, you need to update the default Storybook configuration a bit so that you don't get errors when trying to use Gatsby specific components inside of the stories.

To update your Storybook config open `.storybook/config.js` and add the following before the `configure` method at the bottom of the file.

Expand Down
7 changes: 7 additions & 0 deletions yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -11584,6 +11584,13 @@ jws@^3.1.4, jws@^3.1.5:
jwa "^1.1.5"
safe-buffer "^5.0.1"

"katex@>=0.10.0 <1.0.0":
version "0.10.0"
resolved "https://registry.yarnpkg.com/katex/-/katex-0.10.0.tgz#da562e5d0d5cc3aa602e27af8a9b8710bfbce765"
integrity sha512-/WRvx+L1eVBrLwX7QzKU1dQuaGnE7E8hDvx3VWfZh9HbMiCfsKWJNnYZ0S8ZMDAfAyDSofdyXIrH/hujF1fYXg==
dependencies:
commander "^2.16.0"

kebab-case@^1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/kebab-case/-/kebab-case-1.0.0.tgz#3f9e4990adcad0c686c0e701f7645868f75f91eb"
Expand Down

0 comments on commit 75b04bb

Please sign in to comment.