AssertionError [ERR_ASSERTION]: did not recognize object of type "File"

[romanlex]

I have multiple errors with same types when trying build docs with styleguidist

Production mode doesn't work, development mode work properly. Use react 17 with new jsx transform.

Source from production build

Browser error bundle.41681933.js:formatted:33543 Uncaught TypeError: Object(...) is not a function

Main app with same config (webpack+babel) work properly in dev and prod mode

[danez]

Can you please provide an example of a component, which shows this behavior?

[anurag-zumen]

I am Also Facing the Same Issue

[anurag-zumen]

import Select from 'react-select';
import React from 'react';
import * as R from 'ramda';
import PropTypes from 'prop-types';
import { checkForDisabled } from './utils';

const renderTitle = (schema) => (
  <div className="listhed flex align-center justify-space-between">
    <h5 className="fs-12">{R.pathOr('', ['title'], schema)}</h5>
  </div>
);

const renderSelect = (row, data, onRowChange) => (
  <Select
    className="w-220 custom_select singleselect selt-drosrch"
    value={data[R.pathOr('', ['id'], row)]}
    getOptionValue={(option) => option.label}
    onChange={(e) => onRowChange(e, R.pathOr('', ['id'], row))}
    options={R.pathOr([], ['options'], row)}
    defaultValue={R.pathOr('', ['defaultValue'], row)}
    isClearable
    placeholder={R.pathOr('', ['placeholder'], row)}
  />
);

const renderFields = (row, data, onRowChange) => {
  switch (R.pathOr('', ['type'], row)) {
    case 'select': return renderSelect(row, data, onRowChange);
    default: return null;
  }
};

const renderBody = (schema, data, onRowChange) => R.pathOr([], ['rows'], schema).map((row) => (
  <div className="flex justify-space-between margn m-b-10" key={row.id}>
    <p>
      {R.pathOr('', ['name'], row)}
      {
                R.pathOr(false, ['isRequired'], row)
                && <span className="p-l-5 required">*</span>
}
    </p>
    {renderFields(row, data, onRowChange)}
  </div>
));

const renderButton = (schema, data, onClick) => (
  <button
    className="m-t-10 bluebtnn btn"
    type="submit"
    onClick={() => onClick()}
    disabled={checkForDisabled(schema, data)}
  >
    {R.pathOr('', ['button', 'title'], schema)}
  </button>
);

const CustomFilterModal = ({
  schema, onRowChange, onButtonClick, data,
}) => (
  <div className="selct-listt productdata_wrap">
    {renderTitle(schema)}
    <div className="bodylistt m-t-20 m-b-20">
      {renderBody(schema, data || {}, onRowChange)}
    </div>
    <div className="flex justify-flex-end p-r-15 m-b-10 m-t-20 b-top border-light">
      {renderButton(schema, data || {}, onButtonClick)}
    </div>
  </div>
);

CustomFilterModal.propTypes = {
  schema: PropTypes.shape({
    title: PropTypes.string,
    rows: PropTypes.arrayOf(PropTypes.shape({
      id: PropTypes.string.isRequired,
      name: PropTypes.string,
      type: PropTypes.string,
      options: PropTypes.arrayOf(PropTypes.shape({
        name: PropTypes.string,
        label: PropTypes.string,
        value: PropTypes.string,
      })),
      defaultValue: PropTypes.string,
      placeholder: PropTypes.string,
      isRequired: PropTypes.bool,
    })),
    button: PropTypes.shape({
      title: PropTypes.string,
    }),
  }),
  onRowChange: PropTypes.func,
  onButtonClick: PropTypes.func,
  data: PropTypes.object,
};

CustomFilterModal.defaultProps = {
  data: {},
  schema: {},
  onButtonClick: () => {},
  onRowChange: () => {},
};

export default CustomFilterModal;

[HariAbinesh]

Hi, the issue is due to styleguidist resolver. so i included,

propsParser (filePath, source, resolver, handlers) { const reactDocgen = require('react-docgen'); return reactDocgen.parse(source, reactDocgen.resolver.findAllComponentDefinitions, handlers); } in my styleguide.config.js and it worked.

https://react-styleguidist.js.org/docs/configuration#propsparser

[aleksan4eg]

For me helped not propsParser as @HariAbinesh mentioned, but resolver.

Just include in styleguide.config.js:

resolver: require("react-docgen").resolver.findAllComponentDefinitions,