I am using create-react-app for an app I am building and when I try to access PropTypes directly from React I get the following error in the console: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead.

If you are reporting a bug, please fill in below. Otherwise feel free to remove this template entirely.

Can you reproduce the problem with latest npm?

Yes. Many errors, especially related to “missing modules”, are due to npm bugs.

If you’re using Windows, follow these instructions to update npm.

If you’re using OS X or Linux, run this to update npm:

npm install -g npm@latest

cd your_project_directory
rm -rf node_modules
npm install

Then try to reproduce the issue again.

Can you still reproduce it? Yes

Description

I am wondering whether or not you have added the npm package prop-types to create-react app, because if we still have to access PropTypes directly from React, that has been deprecated and PropTypes is therefore ineffective. What are you reporting? A bug/deprecation

Expected behavior

To be able to test for proper PropTypes with React.PropTypes without getting an error in the console. Tell us what you think should happen. If I remove something that has been set as .isRequired with React.PropTypes, that I should be notified if the type is incorrect (or non-existent).

Actual behavior

I get the following error in the console: Warning: Accessing PropTypes via the main React package is deprecated. Use the prop-types package from npm instead. And nothing happens when I try to create an error. It is not recognized by the deprecated React.PropTypes method. Tell us what actually happens.

Environment

Run these commands in the project folder and fill in their results:

1. npm ls react-scripts (if you haven’t ejected): react-scripts@0.9.5
2. node -v: 7.8.0
3. npm -v: 4.2.0

Then, specify:

1. Operating system: Mac OS Sierra 10.12
2. Browser and version: Chrome Version 58.0.3029.81 (64-bit)

Reproducible Demo

Please take the time to create a new app that reproduces the issue.

Alternatively, you could copy your app that experiences the problem and start removing things until you’re left with the minimal reproducible demo.

(Accidentally, you might get to the root of your problem during that process.)

Push to GitHub and paste the link here. https://github.com/interglobalmedia/todo-list-create-react-app By doing this, you’re helping the Create React App contributors a big time! Demonstrable issues gets fixed faster.

[gaearon]

Hi! The warning is saying that React.PropTypes will eventually be removed from the react package, so you need to migrate to use the prop-types package instead (it’s not urgent—your code is not broken).

First, install prop-types in terminal:

npm install --save prop-types

(or yarn add prop-types if you use Yarn)

Then, you need to update the code as explained in the React 15.5 blog post.

For example, here you could replace:

import React from 'react';

export const TodoForm = (props) => (
	<form>
		<input type="text" onChange={props.handleInputChange} value={props.currentTodo}/>
	</form>)

TodoForm.propTypes = {
	currentTodo: React.PropTypes.string.isRequired,
	handleInputChange: React.PropTypes.func.isRequired
}

with

import React from 'react';
import PropTypes from 'prop-types'; // <------- note I added this

export const TodoForm = (props) => (
	<form>
		<input type="text" onChange={props.handleInputChange} value={props.currentTodo}/>
	</form>)

TodoForm.propTypes = {
	currentTodo: PropTypes.string.isRequired,  // <------- note I changed this
	handleInputChange: PropTypes.func.isRequired  // <------- note I changed this
}

Note that this is not urgent. This is a deprecation warning, and doesn’t indicate an immediate problem with your code. It is, however, a good idea to fix it when you have the time so that you can update to React 16 more easily when it becomes available.

I hope this helps!

[jmlivingston]

My issue was related to react-router. If you are using 3.x, make sure to update to 3.04 or higher. If you’re on 4.x, update to 4.1.1.