# react/no-typos

> Disallow misspelled lifecycle methods, static properties, and prop types

React finds `componentDidMount`, `propTypes`, and `defaultProps` by name. If you write `componentDidmount` or `PropTypes`, nothing fails. React never calls the method and never checks the props.

The rule reports four kinds of mistakes in a component:

- A lifecycle method, such as `componentDidMount` or `shouldComponentUpdate`, with the wrong capitalization.
- `getDerivedStateFromProps` without `static`.
- `propTypes`, `contextTypes`, `childContextTypes`, or `defaultProps` with the wrong capitalization.
- A type that the `prop-types` package doesn't have, such as `PropTypes.boolean`, or anything other than `.isRequired` after a type. This only works if the file imports `prop-types` or `react`.

It also reports `import "react"` and `import "prop-types"`, which don't import any names.

{/* Generated by src/codegen/lint-rule-docs.ts. Do not edit this section. */}

## Configure

Off by default. To turn it on:

```toml bunfig.toml
[lint.rules]
"react/no-typos" = "error" # or "warn"
```

{/* End of the generated section. */}

## Examples

Reported:

{/* bad {"count": 3} */}
```jsx
class Clock extends React.Component {
  static DefaultProps = { interval: 1000 };

  getDerivedStateFromProps(props) {
    return { interval: props.interval };
  }

  componentDidmount() {
    this.start();
  }
}
```

{/* bad {"count": 2} */}
```jsx
import PropTypes from "prop-types";

class Clock extends React.Component {
  static propTypes = {
    running: PropTypes.boolean,
    interval: PropTypes.number.isrequired,
  };
}
```

Not reported:

{/* good */}
```jsx
import PropTypes from "prop-types";

class Clock extends React.Component {
  static propTypes = {
    running: PropTypes.bool,
    interval: PropTypes.number.isRequired,
  };

  static defaultProps = { interval: 1000 };

  static getDerivedStateFromProps(props) {
    return { interval: props.interval };
  }

  componentDidMount() {
    this.start();
  }
}
```