Invariant Violation: ViewPropTypes has been removed from React Native. Migrate to ViewPropTypes exported from 'deprecated-react-native-prop-types'

 Invariant Violation: ViewPropTypes has been removed from React Native. Migrate to ViewPropTypes exported from 'deprecated-react-native-prop-types'

ViewPropTypes is removed from React Native. If you try to use it, then React Native will throw ERROR Invariant Violation: ViewPropTypes has been removed from React Native. Migrate to ViewPropTypes exported from ‘deprecated-react-native-prop-types’. To resolve this, you need to install it from deprecated package.

Solution

Step 1: Install patch-package

Step 2: Install deprecated-react-native-prop-types –

npm install deprecated-react-native-prop-types

or

yarn add deprecated-react-native-prop-types

Step 3: Go to node_modules/react-native/index.js change this –

// Deprecated Prop Types

get ColorPropType(): $FlowFixMe {

invariant(

false,

"ColorPropType has been removed from React Native. Migrate to " +

"ColorPropType exported from 'deprecated-react-native-prop-types'.",

);

},

get EdgeInsetsPropType(): $FlowFixMe {

invariant(

false,

"EdgeInsetsPropType has been removed from React Native. Migrate to " +

"EdgeInsetsPropType exported from 'deprecated-react-native-prop-types'.",

);

},

get PointPropType(): $FlowFixMe {

invariant(

false,

"PointPropType has been removed from React Native. Migrate to " +

"PointPropType exported from 'deprecated-react-native-prop-types'.",

);

},

get ViewPropTypes(): $FlowFixMe {

invariant(

false,

"ViewPropTypes has been removed from React Native. Migrate to " +

"ViewPropTypes exported from 'deprecated-react-native-prop-types'.",

);

},

with this –

// Deprecated Prop Types

get ColorPropType(): $FlowFixMe {

return require("deprecated-react-native-prop-types").ColorPropType

},

get EdgeInsetsPropType(): $FlowFixMe {

return require("deprecated-react-native-prop-types").EdgeInsetsPropType

},

get PointPropType(): $FlowFixMe {

return require("deprecated-react-native-prop-types").PointPropType

},

get ViewPropTypes(): $FlowFixMe {

return require("deprecated-react-native-prop-types").ViewPropTypes

},

Step 4: Save patch by running this command –

npx patch-package react-native

Step 5: Rebuild app

Note: If you upgrade react-native, you will need to reapply this patch.