Where communities thrive

  • Join over 1.5M+ people
  • Join over 100K+ communities
  • Free without limits
  • Create your own community
Repo info
  • Mar 23 2018 05:16
    ZxBing0066 opened #887
  • Mar 22 2018 21:22
    sapegin closed #886
  • Mar 22 2018 16:17
    sapegin labeled #886
  • Mar 22 2018 16:17
    sapegin labeled #886
  • Mar 22 2018 14:36
    stefanheine opened #886
  • Mar 22 2018 11:24
    sapegin labeled #826
  • Mar 22 2018 11:24
    sapegin closed #867
  • Mar 22 2018 11:23
    sapegin closed #883
  • Mar 22 2018 10:34
    sapegin closed #885
  • Mar 22 2018 09:49
    sapegin closed #881
  • Mar 22 2018 09:44
    RusinovAnton opened #885
  • Mar 22 2018 09:32
    sapegin closed #882
  • Mar 22 2018 09:32
    sapegin milestoned #883
  • Mar 22 2018 09:31
    sapegin labeled #883
  • Mar 22 2018 09:31
    sapegin labeled #884
  • Mar 22 2018 08:15
    sapegin edited #195
  • Mar 21 2018 22:56
    jsphstls opened #884
  • Mar 21 2018 20:14
    denchen edited #883
  • Mar 21 2018 20:13
    denchen opened #883
  • Mar 21 2018 18:08
    sapegin milestoned #868
Diogo Esteves
i just run the comands and i don't see anything in side the components
i nned to add manualy the components on the docs?
Mathieu Marques
Hello, how can I use theme variables from within the configuration file like the documentation suggests? https://react-styleguidist.js.org/docs/cookbook.html#how-to-change-styles-of-a-style-guide
(specifically space which is exported from src/client/styles/theme.js)
Mathieu Marques
Second question, how could I use propsParser option to ignore all classes props without having to manually specify @ignore? Those props come from my own withStyles implementation and shouldn't appear in the documentation
How do I override the style guide name without having to change the name in package.json. I tried displayName property but it does not work.
Tim K.
Hello, is there anyone here familiar with the Styleguidist code base?
I have a question regarding the examples loader and code playground, want to make a PR to support markdown hot loading
Hi, guys, I find styleguidist cool on first sight, but my use case will be a doc site that imbed what styleguidist provides, but it seems styleguidist can only be used as a saparated server?
Aminadav Glickshtein
Anyone success to get the prop types using @param annoitation?
For e.g. @param abc {string}
I'm trying using react-docgen and using react-docgen-typescript
And never success
Hey I saw some questions in the chat and on git about dynamic theming the components in styleguidist, but couldn't find a solution to make it work... Is it just not possible or did I just miss it?
Hey guys
It seems react-styleguidist is not accurately parsing my tsx files.

I am getting this message:

Warning: Cannot parse src/common/components/form/radio/radio-switch-yes-no.tsx: SyntaxError: /home/sa/frontend/src/common/components/form/radio/radio-switch-yes-no.tsx: Unexpected reserved word 'interface' (5:0)

3 | import * as React from 'react';
4 |

5 | interface Props {
| ^

Anyone know why that might be ?
My webpack is configured to use tsx
I get all my documentation production build broken for some reason, example: https://rollup-umd.github.io/test/ , Error: RangeError: Maximum call stack size exceeded, I have not change anything in the source code, it just happen to be broken. I can't remove UglifyJS plugin because react-styleguidist forbid it. Is there a way I can trace and find what cause all my documentations to be
Also I'd like how to know how to disable uglifyjs on production build so I can debug.
thanks in advance for your help
Leo Leo
All my components' URL shows up with a hashbang (#!), is that part of react styleguidist's configuration? If so, how can I change it so the URL does not include hashbang? Thanks!
Vikas Gourav

I always get this error:
"Another server is running at port 6060 already. Please stop it or change the default port to continue.

You can change the port using the serverPort option in your style guide config:

even if I use different serverPort in my styleguide.config.js, it gives me the same error with the port mentioned in config
like "Another server is running at port 4040 already. Please stop it or change the default port to continue."
Can someone help me?
Thanks in advance!
Esa Juhana

From the docs:

1. Install Styleguidist
2. Configure your style guide
3. Start your style guide
4. Start documenting your components
  1. Then what? What alternatives I have for using those components in real project?

Publishing npm or what?

How do I import {Button} from 'my-design-system' in my project?
So my styleguidist builds perfectly locally (i.e., with yarn start it looks good). But when I deploy the Github Pages, the left navigation is missing and only the root README is showing. Any ideas?
Brian Meise
Does anyone know the proper way to style the styleguidist site itself? I'm current adding style to the styleguide-wrap.scss file – which works but I'm applying to classes like .rsg--logo-70
The problem is that these numbers on classes change I think when content gets added/removed?
So I can't target specific elements
Chuntonov Mikhail

hi everyone. I just started to work with react-stylequidist, and when I try to run any example, I have unexpected token error

SyntaxError: Unexpected token (1:6)
1 : <React.Fragment><Loader />

I have made Pastebin example where u can see my config, component and .md file. https://pastebin.com/uVzSGQBC

I tried to find some solutions at goggle but didn't find anything helpful. Sorry for my English

Daniel Ortiz Costa
Hey is there any ideas on how to implement a global theme selector? I want to have a drop down at the top that sets the current theme but unfortunately each component gets rendered independently so they can’t access the global theme provider that I put on style guiderender.... is there any way to get this to work without using local storage to share the theme?
Esa Juhana


Any tips on configuring font-faces? I am using Icomoon for icons, but in the build version this font-face is not working (in /src/components/)

@font-face {
  font-family: 'icomoon';
  src: url('fonts/icomoon.eot?yj5r32');
  src: url('fonts/icomoon.eot?yj5r32#iefix') format('embedded-opentype'),
    url('fonts/icomoon.ttf?yj5r32') format('truetype'),
    url('fonts/icomoon.woff?yj5r32') format('woff'),
    url('fonts/icomoon.svg?yj5r32#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
  font-display: block;
Should I configure these things in styleguide.config.js?
It's a CRA project
Esa Juhana
Works fine in the dev version
Esa Juhana
I love this channel, everyone's asking questions but no one is answering :DDD
@mandolyte Sounds like you've done something wrong in the deployment tutorial
@bmeise make a themeWrapper like this to styleguide.config.js:
  styleguideComponents: {
    Wrapper: path.join(__dirname, 'src/components/ThemeWrapper')
My ThemeWrapper (Typescript):

import React, {Component, ReactChild} from 'react';
import {ThemeProvider} from 'styled-components';
import {theme} from './theme';
import './styleguidist.css';

interface ThemeWrapperProps {
  children: ReactChild;

export default class ThemeWrapper extends Component<ThemeWrapperProps> {
  render() {
    return <ThemeProvider theme={theme}>{this.props.children}</ThemeProvider>;
Osny Netto
Hello folks, Im trying to start styleguidist server but getting this error: https://share.getcloudapp.com/5zu5E2jO
Random bug

I love this channel, everyone's asking questions but no one is answering :DDD

Yeah, basically only questions, no answers at all in this channel.

Anyway, I got here to actually complain about something else ':D
A fix for issue: styleguidist/react-styleguidist#1321 is required for me to continue using this package.