Use Proptypes to define the Props you expect

Use Proptypes to define the Props you expect
0.0 0
#1

I have searched everywhere for two days. For some reason, my FCC console is stating “require is not defined,” and nothing is rendering. What is wrong with my code???

import React, { PropTypes } from 'react';

const Items = (props) => {
  return (<h1>Current Quantity of Items in Cart: {props.quantity}</h1>)
};

// change code below this line
Items.propTypes = {
  quantity: PropTypes.number.isRequired
};
// change code above this line

Items.defaultProps = {
  quantity: 0
};

class ShoppingCart extends React.Component {
  constructor(props) {
    super(props);
  }
  render() {
    return <Items quantity={3}/>
  }
};

Thank you so much. This has been a pain.

#2

What version I of react are you using? Prop types is now a separate installation in 16 and on

#3

I’m unsure. I’m just learning it on the FCC console right now.
Thanks for the response!

#4

What’s the FCC console, is that in the beta version? If it’s 16 or higher it needs to be imported specifically. This could be a sitewide issue then if others are having problems with it. Try another way, maybe codepen…where you have control over what libraries you’re including?

#5

Or, just take the PropTypes out for now. it’s not required, (it’s just a good development practice) You can add it later.

#6

It’s in the beta version. How would I call it specifically?
Thanks for the help bro!

#7

  1. I’m a sis, not a bro, lol.

  2. You would need to include react libraries as scripts like this, and can do that from codepen. But if your’e in the FCC console in beta, i’m guessing that’s on the backend. I don’t even know if that’s the issue, but if you have some patience, it’s worth trying this in a different editor, or even locally.

Note I coped these from a tutorial…the current React version is 16.3.2

<script src="https://unpkg.com/react@15.6.1/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15.6.1/dist/react-dom.js"></script>
#8

Thanks so much! My bad.

#9

Just remove that import statement at the top, it will work.