Stack Overflow
Stack Overflow

Questions tagged [react-styleguidist]

React Styleguidist is a component development environment with hot reloaded dev server and a living style guide that you can share with your team. It lists component `propTypes` and shows live, editable usage examples based on Markdown files.

React Styleguidist is a component development environment with hot reloaded dev server and a living style guide that you can share with your team. It lists component propTypes and shows live, editable usage examples based on Markdown files.

85 questions
20
votes
5 answers

Can't resolve 'core-js/modules/es.array.concat'

I upgraded babel 6.x → 7.x but having issues running Webpack. It is complaining about missing core-js/modules/*. My babel.config.js is in the root directory. I converted the previously existing .babelrc to js (.babelrc also produced the same…
Elijah
  • 1,252
  • 3
  • 21
  • 32
7
votes
1 answer

Setup react-styleguidist, Create React App, Typescript, Material UI and styled-components

Im trying to setup react-styleguidist (RSG) from Create React App 3 (CRA), Typescript, Material UI and styled-components. I'm stuck on this error: ./node_modules/react-styleguidist/lib/client/rsg-components/ReactExample/ReactExample.js Module not…
olefrank
  • 6,452
  • 14
  • 65
  • 90
5
votes
3 answers

React Native Text Input fields not taking full width even though flex: 1

I am making a form on formik and want it to take the full screen width. I have tried flex: 1, changing the flex direction, and changing the padding. When text goes wider than the input field it expands to fit it. I don't want to set the width…
anonymous
  • 319
  • 1
  • 5
  • 16
5
votes
2 answers

How to render two components inside a .md file for styleguidist in React?

I am trying to create a styleguide with custom components. I need to be able to insert components inside of each other and not sure how to do that inside of the .md file. I have a list and list items. I want to display the list items inside of the…
userlkjsflkdsvm
  • 961
  • 1
  • 21
  • 53
4
votes
1 answer

React Styleguidist starting slooooooow

We use https://react-styleguidist.js.org/ to develop and display components for re-use. We used it for some years now and consists of JS and TS files. When starting with styleguidist server, the project is unbearable slow (approx. 4 mins). I tried…
olefrank
  • 6,452
  • 14
  • 65
  • 90
4
votes
0 answers

Load my styles files inside React helmet, before the component styles load

In my applications app.js, I load bootstrap CSS inside my react helmet for some reason, but loads after components customs styles loads. So some of my overrides styles not working. how can i load react-helmet CSS before the components?. Please help…
Praveen Kumar
  • 161
  • 1
  • 6
4
votes
2 answers

Module parse failed: Unexpected character '�' (1:0) You may need an appropriate loader to handle this file type

I am using styleguidist for my react application, here is the code of my styleguid.config.js file: module.exports = { webpackConfig: { module: { rules: [ // Babel loader, will use your project’s .babelrc { test:…
developerExecutive
  • 89
  • 1
  • 2
  • 11
4
votes
0 answers

Setting up React Styleguidist with Next.js and Typescript

I am trying to setup React styleguidist with next.js and typescript, but I keep walking into problems. My current styleguide.config.js looks like this: const path = require('path'); module.exports = { components: './components/**/*.tsx', …
Björn Rave
  • 119
  • 1
  • 16
3
votes
1 answer

How to build React Styleguidist with Tailwind CSS using CRACO Webpack config?

As specified in their documentation, using Tailwind CSS with CRA (create-react-app) requires replacing react-scripts with craco. Now, I'm trying to build a component library using React Styleguidist. I was able to get Tailwind CSS to display…
carrotjuicelol
  • 31
  • 2
3
votes
1 answer

How to wrap all the react examples in styleguidist with a custom theme provider?

Currently, Styleguidist uses ReactExample to render components. I want to wrap all the ReactExample components in a page with my custom theme provider. As you see below, all the ReactExample components fall outside of the root Styleguide Component. …
Jagadeesh Avvaru
  • 31
  • 3
3
votes
1 answer

What is the appropriate webpack loader to use static keywords?

I have the following error when I try to start my react-styleguidist documentation: ./node_modules/react-native-gesture-handler/touchables/TouchableHighlight.js 10:22 Module parse failed: Unexpected token (10:22) You may need an appropriate loader…
Dimitri Kopriwa
  • 13,139
  • 27
  • 98
  • 204
3
votes
0 answers

Styleguidist: Module not found errors

I am trying to get Styleguidist to run in an existing React environment. When running yarn styleguidist build I get errors like this: My styleguide.config.js: module.exports = { components: 'src/components/**/[A-Z]*.js', webpackConfig: { …
nerdess
  • 10,051
  • 10
  • 45
  • 55
3
votes
0 answers

Cannot use other components as children in React Styleguidist documentation

I'm using React Styleguidist (version 8.0.6) to document React components. I have a directory structure like this: Card - Card.js - Card.md ActionItems - ActionItems.js - ActionItems.md Each of these 2 components renders correctly on its own…
D Baker
  • 31
  • 2
3
votes
1 answer

How to add examples a component with dependencies in react-styleguidist

I would like to document a ButtonGroup component rendering Button components within it using `react-styleguidist'. I have a styleguidist webpack config which looks like this: module.exports = { module: { rules: [ { test:…
vamsiampolu
  • 6,328
  • 19
  • 82
  • 183
2
votes
1 answer

vue-styleguidist does not serve because: Attempted import error: 'h' is not exported from 'vue' (imported as 'Vue')

I'm trying to run vue-styleguidist server but I'm getting this error: Attempted import error: 'h' is not exported from 'vue' (imported as 'Vue'). @ ./node_modules/vue-styleguidist/lib/client/rsg-components/Preview/PreviewAsync.js @…
farnaz farzipour
  • 51
  • 2
1
2 3 4 5 6