Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

TS2339: Property 'PropTypes' does not exist on type 'typeof React' when porting to Typescript

I'm currently converting a javascript/react project to a typescript/react/redux project.

I'm currently having a problem with this file:

import React from 'react';
import GoldenLayout from 'golden-layout';
import {Provider} from 'react-redux';
import Default from '../modules/m-Default/Default';

interface GoldenLayoutWrapperProps {}

interface GoldenLayoutWrapperState {}

class GoldenLayoutWrapper extends React.Component <GoldenLayoutWrapperProps, GoldenLayoutWrapperState> {

    public layout;
    static contextTypes = {
        store: React.PropTypes.object.isRequired
    };

    private wrapComponent(Component, store) {
        class Wrapped extends React.Component {
            render () {
                return (
                    <Provider store={store}>
                        <Component {...this.props}/>
                    </Provider>
                )
            }
        }
        return Wrapped;
    }

    componentDidMount() {
        var layout = new GoldenLayout(this.layoutConfig, this.layout);

        layout.registerComponent('Default', this.wrapComponent(Default, this.context.store));
    }

    render() {
        return (
            <div className="golden-layout-wrapper" ref={input => this.layout = input}/>
        )
    }

    private layoutConfig = {}
}

   export default GoldenLayoutWrapper;

When I attempt to compile, I get the following error:

ERROR in [at-loader] ./src/main/GoldenLayoutWrapper.tsx:18:22 
TS2339: Property 'PropTypes' does not exist on type 'typeof React'.

After some searcing, some people suggested to give contextTypes a static modifier, which I attempted, but the problem still persists.

What could be the problem?

like image 590
JavascriptLoser Avatar asked Feb 22 '18 22:02

JavascriptLoser


1 Answers

As you are using React v16.0.0 , You need to make use of prop-types as it is treated a separate library since React v15.5

You can install it via npm as a project dependency

npm install --save prop-types

And then inside your component where you want to use it :

import PropTypes from 'prop-types'; // ES6

Instead of React.PropTypes you can directly use PropTypes

You can read more about prop-types Here

like image 167
Aaqib Avatar answered Sep 22 '22 02:09

Aaqib