It is a known issue. If you are using yarn, you can easily get around it using resolutions. Add the following to your package.json to allow yarn to resolve babel-loader version 8.1.0 (the version required by CRA, not Storybook): “resolutions”: { “babel-loader”: “8.1.0” }, After that, make sure to run yarn install to refresh your … Read more
Use directly React.ReactElement (or, to be more precise, React.ReactElement | null): import { ReactElement } from “react”; export function TestComponent(): ReactElement | null { return ( Math.random() < 0.5 ? null : <> A single Element (could be a Fragment like here) </> ); } This is exactly what (the no longer recommended) React.FC enforces: … Read more
The problem apparently was caused by a misconfiguration of some (peer?) dependencies of a dependency, react-scripts with the TypeScript template. It went away. Make sure you update your dependencies, purge node_modules, even purge package-lock.json or yarn.lock, and try a fresh build again now.
Write your interface like this: export interface IInputWrapperProps { label?: string; required?: boolean; minimizedLabel?: boolean; description?: string; error?: string; wrapperStyle?: React.CSSProperties; children?: JSX.Element|JSX.Element[]; } in fact writing: children: JSX.Element|JSX.Element[]; The children can be either a single JSX Element or an array of Elements.