> For the complete documentation index, see [llms.txt](https://sharryhong.gitbook.io/front-end/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sharryhong.gitbook.io/front-end/front-end-dev/storybook/global-style-storybook.md).

# storybook에 Global Style 적용하기

2021-06-09

### 이슈 

storybook에서 global style이 적용되지 않아서, 실제 스타일과 다른 이슈 발생!

### 해결방법 

> .storybook/preview\.js 

```
import GlobalStyle from '../styles/global-styles'; 

export const decorators = [
  Story => (
    <>
      <GlobalStyle />
      <Story />
    </>
  ),
];
```

> styles/global-styles.ts

```
import { createGlobalStyle } from 'styled-components';
import reset from 'styled-reset';

const GlobalStyle = createGlobalStyle`
  ${reset}
  
  ... global 스타일 적용 
`;
export default GlobalStyle;

```