Skip to content
This repository was archived by the owner on Jan 20, 2025. It is now read-only.

Commit 2530cab

Browse files
committed
docs: update visual-testing-with-storybook
1 parent 22333fc commit 2530cab

File tree

1 file changed

+3
-3
lines changed

1 file changed

+3
-3
lines changed

docs/docs/visual-testing-with-storybook.md

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -94,7 +94,7 @@ module.exports = ({ config }) => {
9494

9595
> コンポーネントで [StaticQuery](/docs/static-query/) を使用している場合、 Storybook でレンダリングするために `babel-plugin-remove-graphql-queries` が必要であることに注意してください。これはクエリが、 Gatsby のビルド時には実行され、コンポーネントを直接レンダリングするときには実行されないようにするためです。
9696
97-
> TypeScript を使用する場合、以下のルールを追加します
97+
> TypeScript を使用する場合、以下のルールを追加します
9898
9999
```diff:title=.storybook/webpack.config.js
100100
// Prefer Gatsby ES6 entrypoint (module) over commonjs (main) entrypoint
@@ -148,15 +148,15 @@ module.exports = (baseConfig, env, defaultConfig) => {
148148
}
149149
```
150150

151-
これを設定したら Storybook を実行し、適切に起動できることと、 CLI によってインストールされたデフォルトのストーリーを確認できるようにする必要があります。 Storybook を実行するには以下のコマンドを実行します。
151+
設定が完了したら、それが適切に起動でき、 CLI によってインストールされたデフォルトのストーリーが立ち上がるかを確認するために Storybook を実行してみましょう。 Storybook を実行するには以下のコマンドを実行します。
152152

153153
```shell
154154
npm run storybook
155155
```
156156

157157
Storybook CLI はこのコマンドを `package.json` に追加してくれるので、コマンドを実行する以外に何もする必要はありません。Storybook がビルドに成功すれば、 <http://localhost:6006> に移動して、Storybook CLI によって提供されたデフォルトのストーリーを表示できるはずです。
158158

159-
ただし、`StaticQuery` または `useStaticQuery` をプロジェクトで使用する場合、 Storybook は `NODE_ENV``production` に設定して実行する必要があります ( Storybook はデフォルトで `development` に設定するため)。そうしなければ `babel-plugin-remove-graphql-queries` は実行されません。さらに、 Storybook は Gatsby の `StaticQuery` によって生成された [static files](https://storybook.js.org/docs/configurations/serving-static-files/#2-via-a-directory) について知る必要があります。スクリプトは以下のようになります。
159+
ただし、`StaticQuery` または `useStaticQuery` をプロジェクトで使用する場合、 Storybook は `NODE_ENV``production` に設定して実行する必要があります (Storybook はデフォルトで `development` に設定するため)。そうしなければ `babel-plugin-remove-graphql-queries` は実行されません。さらに、 Storybook は Gatsby の `StaticQuery` によって生成された [static files](https://storybook.js.org/docs/configurations/serving-static-files/#2-via-a-directory) について知る必要があります。スクリプトは以下のようになります。
160160

161161
```json:title=package.json
162162
{

0 commit comments

Comments
 (0)