Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

react/prop-types doesn't work with fragment syntax

See original GitHub issue

Example:

import React from "react";

const ForAttendees = ({ page }) => (
  <>
    <section className="intro intro_attendees">{page}</section>
    <div className="grid--5col">barfoo</div>
  </>
);

export default ForAttendees;

react/prop-types does not capture this. If you replace the fragment syntax with divs, it detects the case.

Issue Analytics

State:
Created 6 years ago
Reactions:4
Comments:7 (4 by maintainers)

Top GitHub Comments

1reaction

graingertcommented, Aug 30, 2018

FYI, babel 7 got released

0reactions

ljharbcommented, Aug 30, 2018

See #1956

Top Results From Across the Web

react/prop-types doesn't work with fragment syntax · Issue #1694 ...

Example: import React from "react"; const ForAttendees = ({ page }) => ( <> {page} barfoo ); export default ForAttendees; react/prop-types does no......

Typechecking With PropTypes - React

To run typechecking on the props for a component, you can assign the special propTypes property: import PropTypes from 'prop-types'; class Greeting extends ......

Flow errors on <React.Fragment> or <></>, but not <Fragment>

I would like to use the <></> Fragment shorthand syntax, and this issue is stopping me from doing that for now. When I...

How to validate React props using PropTypes - LogRocket Blog

Learn how to validate props with React PropTypes, React's internal mechanism for adding type checking to component props.

How to forget about type errors in your React props with ...

Using prop types in React gives you a bit of the TypeScript experience at runtime without having to use TypeScript. The problem. The...