Error with Stateless Components

Has anyone else had an issue with getting stateless functional components to load?

I am getting this error:

Error when parsing src/scripts/components/Inputs/Button.jsx RangeError: Maximum call stack size exceeded

This my styleguide.config,js

/* global module, require, process, __dirname */

const path = require('path');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
const docgen = require('react-docgen');

module.exports = {
    title: 'Components',
    defaultExample: true,
    serverPort: 5000,
    showCode: true,
    skipComponentsWithoutExample: true,
    getExampleFilename: componentpath => componentpath.replace(/\.jsx$/, '.examples.md'),
    resolver: docgen.resolver.findAllComponentDefinitions,
    sections: [
        {
            name: 'Inputs',
            components: './src/scripts/components/Inputs/**/*.jsx',
        },
        {
          name: 'Navigation',
          components: './src/scripts/components/NavBar/**/*.jsx',
        },
        {
          name: 'Layout',
          components: './src/scripts/components/layout/**/*.jsx',
        },
      ],
    updateWebpackConfig: function(webpackConfig, env) {
        const dir = path.join(__dirname, 'src');

        webpackConfig.module.loaders.push(
          {
              test: /\.jsx?$/,
              exclude: /node_modules/,
              include: path.join(__dirname, 'src'),
              loader: 'babel'
          },
          {
              test: /\.css$/,
              include: dir,
              loader: 'style!css?modules&importLoaders=1'
          },
          {
              test: /\.scss$/,
              include: path.join(__dirname, 'src'),
              loader: ExtractTextPlugin.extract(
                'style-loader',
                'css-loader?' +
                'modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]' +
                '!sass')
          },
          {
              test: /\.less$/,
              exclude: /node_modules/,
              loader: 'style!css!less'
          },
          {
              test: /\.(png|jpg|jpeg|gif|svg|woff|woff2)$/,
              include: path.join(__dirname, 'src'),
              loader: 'url?limit=8192'
          }
        );

        webpackConfig.plugins.push(
          new ExtractTextPlugin('css/app.css')
        );

        return webpackConfig;
    }
};

[jeffkamo]

Well, in setting up a pared down example for you, @n1313, I discovered what was causing this issue in my project.

It turns out our project was also depending on react-docgen and was using it into our styleguidist.config.js

const DocGen = require('react-docgen') // <-- v2.15.0 from our local package.json

// ...

module.exports = {
    // ...
    resolver: DocGen.resolver.findAllComponentDefinitions, // <-- this was the problem
    // ...
}

Removing the resolver key from this module.export fixes the problem, and my components appear to work better.

Cheers, and thanks!

Edit!

Instead of just removing the resolver (because we need it), updating react-docgen to 3.0.0-beta9 (which is currently used by react-styleguidist) also fixed this issue.

[SimonSomlai]

Just removing react-docgen didn’t work for me. But ;

downgrading styleguidist from v9 to ^8.0.6 AND removing react-docgen from package.json solved the problem for me.