0

I am using react-styleguidist library for the documentation of my React App. This is my file structure

This is my package.json `

{
  "name": "app",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@date-io/date-fns": "^1.3.13",
    "@emoji-mart/data": "^1.0.5",
    "@emoji-mart/react": "^1.0.1",
    "@emotion/react": "^11.9.0",
    "@emotion/styled": "^11.8.1",
    "@material-ui/core": "^4.12.4",
    "@mui/material": "^5.8.1",
    "@mui/x-date-pickers": "^5.0.0",
    "@mui/x-date-pickers-pro": "^5.0.0",
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "^13.5.0",
    "axios": "^0.27.2",
    "bootstrap": "^5.1.3",
    "chart.js": "^3.8.2",
    "classnames": "^2.3.1",
    "dagre": "^0.8.5",
    "date-fns": "^2.29.2",
    "emoji-mart": "^5.2.1",
    "hashmap": "^2.4.0",
    "history": "^4.10.1",
    "is-url": "^1.2.4",
    "moment": "^2.29.4",
    "react": "^18.2.0",
    "react-awesome-popover": "^6.1.1",
    "react-bootstrap": "^2.4.0",
    "react-chartjs-2": "^4.3.1",
    "react-contextmenu": "^2.14.0",
    "react-copy-to-clipboard": "^5.1.0",
    "react-dom": "^18.2.0",
    "react-flow-renderer": "^10.3.12",
    "react-icons": "^4.3.1",
    "react-input-emoji": "^4.1.0",
    "react-paginate": "^8.1.3",
    "react-pro-sidebar": "^0.7.1",
    "react-redux": "^8.0.4",
    "react-router-dom": "^5.2.0",
    "react-scripts": "5.0.1",
    "react-secure-storage": "^1.0.21",
    "react-select": "^5.4.0",
    "react-toastify": "^9.0.8",
    "react-viewer": "^3.2.2",
    "redux": "^4.2.0",
    "redux-devtools-extension": "^2.13.9",
    "redux-thunk": "^2.4.1",
    "rsuite": "^5.17.1",
    "universal-cookie": "^4.0.4",
    "video-react": "^0.15.0",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "react-styleguidist": "^13.0.0"
  }
}

`

This is my styleguide.config.js `

module.exports = {
    components: 'src/Pages/Dashboard/**/*.{js,jsx,ts,tsx}'
}

`

This is the output I am getting after running "npx styleguidist server"

I want react-styleguidist to display all components in Pages as well as Components folder, but it always showing components from Components folder.

Would anyone help me with this? Thanks in Advance...

0 Answers0