React TypeError: __WEBPACK_IMPORTED_MODULE_0_react __. PropTypes не определен

Я создаю приложение для реагирования с использованием маршрутизаторов и получаю следующую ошибку:

React TypeError: WEBPACK_IMPORTED_MODULE_0_react.PropTypes is undefined

Как мне этого избежать?

Вот код для 2 роутеров, поста и профиля:

Сообщения

import React,{Component} from 'react';


class Posts extends Component{
    render(){
        return <div>  Posts </div>
    }
}

export default Posts;

Профиль

import React,{Component} from 'react';


class Profile extends Component{
    render(){
        return <div>  Profile </div>
    }
}

export default Profile;

index.js

import React,{Component} from 'react';
import ReactDOM from 'react-dom';
import {BrowserRouter, Route} from 'react-router-dom';
import PropTypes from 'prop-types';

//COMPONENTS
import Posts from './Components/posts';
import Profile from './Components/profile';


class App extends Component{

    render(){
        return <div> home </div>

    }
}


ReactDOM.render(
    <BrowserRouter>
    <div>
    <Route path = "/posts" component = {Posts}>  </Route>

    <Route path = "/profile" component = {Profile}>  </Route>

    </div>
    </BrowserRouter>
    
    ,document.querySelector('#root'))

Вот скриншот ошибки:

React TypeError: __WEBPACK_IMPORTED_MODULE_0_react __. PropTypes не определен

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
8
0
16 227
5
Перейти к ответу Данный вопрос помечен как решенный

Ответы 5

Ответ принят как подходящий

Какую версию React вы используете?

Я получил эту ошибку при обновлении до React 16 и изменении моих строк реакции в package.json на:

"react-dom": "^15.1.1",
"react": "^15.1.1",

а затем запуск npm install и npm start исправил это для меня.

Как понижение версии может быть правильным решением этой проблемы?

silkfire 27.11.2018 21:58

@silkfire IKR ?! Это обходной путь, пока React не устранит проблему.

NH. 29.11.2018 00:17

У меня была та же проблема, и я поздно заметил, что в моем операторе импорта есть опечатка.

Вместо:

import React from "react"

Я имел:

import {React} from "react"

исправил это в "react-dom": "^ 16.6.3", изменив

import React,{Component} from 'react';    
class App extends Component{
render(){
    return <div> home </div>
  }
}

к

import React from 'react';    
class App extends React.Component{
render(){
    return <div> home </div>
  }
}

Надеюсь, поможет :)

Я изменил версию этих пакетов в файле packages.json

"react": "^0.14.7",
"react-dom": "^0.14.7",
"react-redux": "^5.1.0",
"redux": "^4.0.1",

затем запустите "npm install" и "npm start" его рабочий

import PropTypes from 'prop-types';

React.PropTypes has moved into a different package since React v15.5. Please use the prop-types library instead.

Можете ли вы расширить свой ответ, включив в него описательную прозу, чтобы объяснить, почему здесь был рассмотрен вопрос исходного автора? -

greggyb 06.09.2019 15:00

Другие вопросы по теме