Skip to content

Commit

Permalink
Merge pull request #17513 from storybookjs/chore_docs_faq_additional_…
Browse files Browse the repository at this point in the history
…tweaks

Chore: (Docs) Provides additional information to the FAQ
  • Loading branch information
jonniebigodes authored Feb 15, 2022
2 parents 678b6bb + b484832 commit f979a5c
Showing 1 changed file with 28 additions and 0 deletions.
28 changes: 28 additions & 0 deletions docs/faq.md
Original file line number Diff line number Diff line change
Expand Up @@ -350,3 +350,31 @@ Applying this small change will enable you to add syntax highlight for SCSS or a
### How can my code detect if it is running in Storybook?
You can do this by checking for the `IS_STORYBOOK` global variable, which will equal `true` when running in Storybook. The environment variable `process.env.STORYBOOK` is also set to `true`.
### Why are my stories not showing up correctly when using certain characters?
Storybook allows you to use most characters while naming your stories. Still, specific characters (e.g., `#`) can lead to issues when Storybook generates the internal identifier for the story, leading to collisions and incorrectly outputting the correct story. We recommend using such characters sparsely.
### Why are the TypeScript examples and documentation using `as` for type safety?
We're aware that the default Typescript story construct might seem outdated and could potentially introduce a less than ideal way of handling type safety and strictness and could be rewritten as such:

```ts
// Button.stories.ts | tsx
import React from 'react';
import { ComponentStory, ComponentMeta } from '@storybook/react';
const StoryMeta: ComponentMeta<typeof Button> = {
/* 👇 The title prop is optional.
* See https://storybook.js.org/docs/react/configure/overview#configure-story-loading
* to learn how to generate automatic titles
*/
title: 'Button',
component: Button,
};
export default meta;
```

Although valid, it introduces additional boilerplate code to the story definition. Instead, we're working towards implementing a safer mechanism based on what's currently being discussed in the following [issue](https://github.com/microsoft/TypeScript/issues/7481). Once the feature is released, we'll migrate our existing examples and documentation accordingly.

0 comments on commit f979a5c

Please sign in to comment.