Build error after upgrading to Expo SDK 47

MuhammadAdnan111 commented 1 year ago

Summary:

I upgrade the Enatega Customer app from SDK 44 to 47. I expect the app is be built successfully.

Managed or bare workflow?

Expo Managed Project

What platform(s) does this occur on?

Both Android and iOS.

SDK Version

expo '47.0.0'

Reproducible demo or steps to reproduce from a blank project

I upgraded my SDK from 44 to 47, using npm i -g expo-cliand expo upgrade, and make a expo publish and npx expo start as are made others many times.

The error occurs in node_modules(TypeError,Invariant Violation)

TypeError: undefined is not an object (evaluating '_reactNative.Text.propTypes.style') at node_modules/react-native/Libraries/Core/ExceptionsManager.js:95:17 in reportException at node_modules/react-native/Libraries/Core/ExceptionsManager.js:141:19 in handleException at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:39 in handleError at node_modules/expo/build/errors/ExpoErrorManager.js:25:19 in errorHandler at node_modules/expo/build/errors/ExpoErrorManager.js:30:24 in at node_modules/@react-native/polyfills/error-guard.js:49:36 in ErrorUtils.reportFatalError at node_modules/metro-runtime/src/polyfills/require.js:237:40 in guardedLoadModule at http://10.97.28.19:19000/node_modules/expo/AppEntry.bundle?platform=ios&dev=true&hot=false&strict=false&minify=false:null in global code

nvariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication(). Module has not been registered as callable. Registered callable JavaScript modules (n = 11): Systrace, JSTimers, HeapCapture, SamplingProfiler, RCTLog, RCTDeviceEventEmitter, RCTNativeAppEventEmitter, GlobalPerformanceLogger, JSDevSupportModule, HMRClient, RCTEventEmitter. A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native. at node_modules/react-native/Libraries/Core/ExceptionsManager.js:95:17 in reportException at node_modules/react-native/Libraries/Core/ExceptionsManager.js:141:19 in handleException at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:39 in handleError at node_modules/expo/build/errors/ExpoErrorManager.js:25:19 in errorHandler at node_modules/expo/build/errors/ExpoErrorManager.js:30:24 in at node_modules/@react-native/polyfills/error-guard.js:49:36 in ErrorUtils.reportFatalError

Invariant Violation: Failed to call into JavaScript module method AppRegistry.runApplication(). Module has not been registered as callable. Registered callable JavaScript modules (n = 11): Systrace, JSTimers, HeapCapture, SamplingProfiler, RCTLog, RCTDeviceEventEmitter, RCTNativeAppEventEmitter, GlobalPerformanceLogger, JSDevSupportModule, HMRClient, RCTEventEmitter. A frequent cause of the error is that the application entry file path is incorrect. This can also happen when the JS bundle is corrupt or there is an early initialization error when loading React Native. at node_modules/react-native/Libraries/Core/ExceptionsManager.js:95:17 in reportException at node_modules/react-native/Libraries/Core/ExceptionsManager.js:141:19 in handleException at node_modules/react-native/Libraries/Core/setUpErrorHandling.js:24:39 in handleError at node_modules/expo/build/errors/ExpoErrorManager.js:25:19 in errorHandler at node_modules/expo/build/errors/ExpoErrorManager.js:30:24 in at node_modules/@react-native/polyfills/error-guard.js:49:36 in ErrorUtils.reportFatalError

How to solve this issue?

My suggestion regarding the issue:

I think fixing in node_modules is not a good solution.

I think the issues occur due to the react-native Navigator(Drawer Navigator specifically). React Navigation 5.x, is no longer actively maintained.

SharanGoharKhan commented 1 year ago

@MuhammadAdnan111 I agree with your suggestion and can reproduce it as well on my system please make a PR for it.

MuhammadAdnan111 commented 1 year ago

Issue resolved

Create the Patch Packages

I resolve the Invariant Violation Errors by Creating patches for the following dependencies.

react-native-buttons
react-native-material-text-field
react-native-star-rating

Solution:

Patch Package for react-native-buttons:

diff --git a/node_modules/react-native-button/Button.js b/node_modules/react-native-button/Button.js
index b248176..3c6aefa 100644
--- a/node_modules/react-native-button/Button.js
+++ b/node_modules/react-native-button/Button.js
@@ -1,4 +1,5 @@
 import PropTypes from 'prop-types';
+import {TextPropTypes,ViewPropTypes} from 'deprecated-react-native-prop-types'
 import React, { Component } from 'react';
 import {
   Platform,
@@ -7,7 +8,7 @@ import {
   TouchableOpacity,
   TouchableNativeFeedback,
   View,
-  ViewPropTypes
+  //ViewPropTypes
 } from 'react-native';

 import coalesceNonElementChildren from './coalesceNonElementChildren';
@@ -18,12 +19,15 @@ export default class Button extends Component {
   static propTypes = {
     ...TouchableOpacity.propTypes,
     accessibilityLabel: PropTypes.string,
-    allowFontScaling: Text.propTypes.allowFontScaling,
+    // allowFontScaling: Text.propTypes.allowFontScaling,
+    allowFontScaling: TextPropTypes.allowFontScaling,
     containerStyle: ViewPropTypes.style,
     disabledContainerStyle: ViewPropTypes.style,
     disabled: PropTypes.bool,
-    style: Text.propTypes.style,
-    styleDisabled: Text.propTypes.style,
+    style: TextPropTypes.style,
+    styleDisabled: TextPropTypes.style,
+    // style: Text.propTypes.style,
+    // styleDisabled: Text.propTypes.style,
     childGroupStyle: ViewPropTypes.style,
     androidBackground: PropTypes.object,
   };

Patch Package for react-native-material-text-field:

diff --git a/node_modules/react-native-material-textfield/src/components/affix/index.js b/node_modules/react-native-material-textfield/src/components/affix/index.js
index 0f85022..e467adb 100644
--- a/node_modules/react-native-material-textfield/src/components/affix/index.js
+++ b/node_modules/react-native-material-textfield/src/components/affix/index.js
@@ -9,26 +9,26 @@ export default class Affix extends PureComponent {
     numberOfLines: 1,
   };

-  static propTypes = {
-    numberOfLines: PropTypes.number,
-    style: Animated.Text.propTypes.style,
+  // static propTypes = {
+  //   numberOfLines: PropTypes.number,
+  //   style: PropTypes.object,

-    color: PropTypes.string.isRequired,
-    fontSize: PropTypes.number.isRequired,
+  //   color: PropTypes.string.isRequired,
+  //   fontSize: PropTypes.number.isRequired,

-    type: PropTypes
-      .oneOf(['prefix', 'suffix'])
-      .isRequired,
+  //   type: PropTypes
+  //     .oneOf(['prefix', 'suffix'])
+  //     .isRequired,

-    labelAnimation: PropTypes
-      .instanceOf(Animated.Value)
-      .isRequired,
+  //   labelAnimation: PropTypes
+  //     .instanceOf(Animated.Value)
+  //     .isRequired,

-    children: PropTypes.oneOfType([
-      PropTypes.arrayOf(PropTypes.node),
-      PropTypes.node,
-    ]),
-  };
+  //   children: PropTypes.oneOfType([
+  //     PropTypes.arrayOf(PropTypes.node),
+  //     PropTypes.node,
+  //   ]),
+  // };

   render() {
     let { labelAnimation, style, children, type, fontSize, color } = this.props;
diff --git a/node_modules/react-native-material-textfield/src/components/counter/index.js b/node_modules/react-native-material-textfield/src/components/counter/index.js
index 35d3264..089b871 100644
--- a/node_modules/react-native-material-textfield/src/components/counter/index.js
+++ b/node_modules/react-native-material-textfield/src/components/counter/index.js
@@ -5,15 +5,15 @@ import { Text } from 'react-native';
 import styles from './styles';

 export default class Counter extends PureComponent {
-  static propTypes = {
-    count: PropTypes.number.isRequired,
-    limit: PropTypes.number,
+  // static propTypes = {
+  //   count: PropTypes.number.isRequired,
+  //   limit: PropTypes.number,

-    baseColor: PropTypes.string.isRequired,
-    errorColor: PropTypes.string.isRequired,
+  //   baseColor: PropTypes.string.isRequired,
+  //   errorColor: PropTypes.string.isRequired,

-    style: Text.propTypes.style,
-  };
+  //   style: PropTypes.object,
+  // };

   render() {
     let { count, limit, baseColor, errorColor, style } = this.props;
diff --git a/node_modules/react-native-material-textfield/src/components/field/index.js b/node_modules/react-native-material-textfield/src/components/field/index.js
index 494bbaa..2a71c82 100644
--- a/node_modules/react-native-material-textfield/src/components/field/index.js
+++ b/node_modules/react-native-material-textfield/src/components/field/index.js
@@ -1,5 +1,6 @@
 import PropTypes from 'prop-types';
 import React, { PureComponent } from 'react';
+import {ViewPropTypes} from 'deprecated-react-native-prop-types';
 import {
   View,
   Text,
@@ -7,7 +8,7 @@ import {
   Animated,
   StyleSheet,
   Platform,
-  ViewPropTypes,
+  //ViewPropTypes,
 } from 'react-native';

 import Line from '../line';
@@ -65,60 +66,60 @@ export default class TextField extends PureComponent {
     disabled: false,
   };

-  static propTypes = {
-    ...TextInput.propTypes,
+  // static propTypes = {
+  //   ...TextInput.propTypes,

-    animationDuration: PropTypes.number,
+  //   animationDuration: PropTypes.number,

-    fontSize: PropTypes.number,
-    labelFontSize: PropTypes.number,
+  //   fontSize: PropTypes.number,
+  //   labelFontSize: PropTypes.number,

-    contentInset: PropTypes.shape({
-      top: PropTypes.number,
-      label: PropTypes.number,
-      input: PropTypes.number,
-      left: PropTypes.number,
-      right: PropTypes.number,
-    }),
+  //   contentInset: PropTypes.shape({
+  //     top: PropTypes.number,
+  //     label: PropTypes.number,
+  //     input: PropTypes.number,
+  //     left: PropTypes.number,
+  //     right: PropTypes.number,
+  //   }),

-    labelOffset: Label.propTypes.offset,
+  //   labelOffset: Label.propTypes.offset,

-    labelTextStyle: Text.propTypes.style,
-    titleTextStyle: Text.propTypes.style,
-    affixTextStyle: Text.propTypes.style,
+  //   labelTextStyle: PropTypes.object.style,
+  //   // titleTextStyle: PropTypes.object.style,
+  //   // affixTextStyle: PropTypes.object.style,

-    tintColor: PropTypes.string,
-    textColor: PropTypes.string,
-    baseColor: PropTypes.string,
+  //   tintColor: PropTypes.string,
+  //   textColor: PropTypes.string,
+  //   baseColor: PropTypes.string,

-    label: PropTypes.string,
-    title: PropTypes.string,
+  //   label: PropTypes.string,
+  //   title: PropTypes.string,

-    characterRestriction: PropTypes.number,
+  //   characterRestriction: PropTypes.number,

-    error: PropTypes.string,
-    errorColor: PropTypes.string,
+  //   error: PropTypes.string,
+  //   errorColor: PropTypes.string,

-    lineWidth: PropTypes.number,
-    activeLineWidth: PropTypes.number,
-    disabledLineWidth: PropTypes.number,
+  //   lineWidth: PropTypes.number,
+  //   activeLineWidth: PropTypes.number,
+  //   disabledLineWidth: PropTypes.number,

-    lineType: Line.propTypes.lineType,
-    disabledLineType: Line.propTypes.lineType,
+  //   lineType: Line.propTypes.lineType,
+  //   disabledLineType: Line.propTypes.lineType,

-    disabled: PropTypes.bool,
+  //   disabled: PropTypes.bool,

-    formatText: PropTypes.func,
+  //   formatText: PropTypes.func,

-    renderLeftAccessory: PropTypes.func,
-    renderRightAccessory: PropTypes.func,
+  //   renderLeftAccessory: PropTypes.func,
+  //   renderRightAccessory: PropTypes.func,

-    prefix: PropTypes.string,
-    suffix: PropTypes.string,
+  //   prefix: PropTypes.string,
+  //   suffix: PropTypes.string,

-    containerStyle: (ViewPropTypes || View.propTypes).style,
-    inputContainerStyle: (ViewPropTypes || View.propTypes).style,
-  };
+  //   containerStyle: (ViewPropTypes || View.propTypes).style,
+  //   inputContainerStyle: (ViewPropTypes || View.propTypes).style,
+  // };

   static inputContainerStyle = styles.inputContainer;

@@ -221,6 +222,7 @@ export default class TextField extends PureComponent {

     let options = {
       toValue: this.focusState(),
+      useNativeDriver: false,
       duration,
     };

diff --git a/node_modules/react-native-material-textfield/src/components/helper/index.js b/node_modules/react-native-material-textfield/src/components/helper/index.js
index 6060f9f..86ac2c0 100644
--- a/node_modules/react-native-material-textfield/src/components/helper/index.js
+++ b/node_modules/react-native-material-textfield/src/components/helper/index.js
@@ -1,23 +1,24 @@
 import PropTypes from 'prop-types';
+
 import React, { PureComponent } from 'react';
 import { Animated } from 'react-native';

 import styles from './styles';

 export default class Helper extends PureComponent {
-  static propTypes = {
-    title: PropTypes.string,
-    error: PropTypes.string,
+  // static propTypes = {
+  //   title: PropTypes.string,
+  //   error: PropTypes.string,

-    disabled: PropTypes.bool,
+  //   disabled: PropTypes.bool,

-    style: Animated.Text.propTypes.style,
+  //   style: PropTypes.object,

-    baseColor: PropTypes.string,
-    errorColor: PropTypes.string,
+  //   baseColor: PropTypes.string,
+  //   errorColor: PropTypes.string,

-    focusAnimation: PropTypes.instanceOf(Animated.Value),
-  };
+  //   focusAnimation: PropTypes.instanceOf(Animated.Value),
+  // };

   constructor(props) {
     super(props);
diff --git a/node_modules/react-native-material-textfield/src/components/label/index.js b/node_modules/react-native-material-textfield/src/components/label/index.js
index 82eaf03..1ad9a93 100644
--- a/node_modules/react-native-material-textfield/src/components/label/index.js
+++ b/node_modules/react-native-material-textfield/src/components/label/index.js
@@ -11,41 +11,41 @@ export default class Label extends PureComponent {
     restricted: false,
   };

-  static propTypes = {
-    numberOfLines: PropTypes.number,
+  // static propTypes = {
+  //   numberOfLines: PropTypes.number,

-    disabled: PropTypes.bool,
-    restricted: PropTypes.bool,
+  //   disabled: PropTypes.bool,
+  //   restricted: PropTypes.bool,

-    fontSize: PropTypes.number.isRequired,
-    activeFontSize: PropTypes.number.isRequired,
+  //   fontSize: PropTypes.number.isRequired,
+  //   activeFontSize: PropTypes.number.isRequired,

-    baseColor: PropTypes.string.isRequired,
-    tintColor: PropTypes.string.isRequired,
-    errorColor: PropTypes.string.isRequired,
+  //   baseColor: PropTypes.string.isRequired,
+  //   tintColor: PropTypes.string.isRequired,
+  //   errorColor: PropTypes.string.isRequired,

-    focusAnimation: PropTypes
-      .instanceOf(Animated.Value)
-      .isRequired,
+  //   focusAnimation: PropTypes
+  //     .instanceOf(Animated.Value)
+  //     .isRequired,

-    labelAnimation: PropTypes
-      .instanceOf(Animated.Value)
-      .isRequired,
+  //   labelAnimation: PropTypes
+  //     .instanceOf(Animated.Value)
+  //     .isRequired,

-    contentInset: PropTypes.shape({
-      label: PropTypes.number,
-    }),
+  //   contentInset: PropTypes.shape({
+  //     label: PropTypes.number,
+  //   }),

-    offset: PropTypes.shape({
-      x0: PropTypes.number,
-      y0: PropTypes.number,
-      x1: PropTypes.number,
-      y1: PropTypes.number,
-    }),
+  //   offset: PropTypes.shape({
+  //     x0: PropTypes.number,
+  //     y0: PropTypes.number,
+  //     x1: PropTypes.number,
+  //     y1: PropTypes.number,
+  //   }),

-    style: Animated.Text.propTypes.style,
-    label: PropTypes.string,
-  };
+  //   style: PropTypes.object,
+  //   label: PropTypes.string,
+  // };

   render() {
     let {
diff --git a/node_modules/react-native-material-textfield/src/components/line/index.js b/node_modules/react-native-material-textfield/src/components/line/index.js
index 44995e9..b689387 100644
--- a/node_modules/react-native-material-textfield/src/components/line/index.js
+++ b/node_modules/react-native-material-textfield/src/components/line/index.js
@@ -16,23 +16,23 @@ export default class Line extends PureComponent {
     restricted: false,
   };

-  static propTypes = {
-    lineType: lineTypes,
-    disabledLineType: lineTypes,
+  // static propTypes = {
+  //   lineType: lineTypes,
+  //   disabledLineType: lineTypes,

-    disabled: PropTypes.bool,
-    restricted: PropTypes.bool,
+  //   disabled: PropTypes.bool,
+  //   restricted: PropTypes.bool,

-    tintColor: PropTypes.string,
-    baseColor: PropTypes.string,
-    errorColor: PropTypes.string,
+  //   tintColor: PropTypes.string,
+  //   baseColor: PropTypes.string,
+  //   errorColor: PropTypes.string,

-    lineWidth: PropTypes.number,
-    activeLineWidth: PropTypes.number,
-    disabledLineWidth: PropTypes.number,
+  //   lineWidth: PropTypes.number,
+  //   activeLineWidth: PropTypes.number,
+  //   disabledLineWidth: PropTypes.number,

-    focusAnimation: PropTypes.instanceOf(Animated.Value),
-  };
+  //   focusAnimation: PropTypes.instanceOf(Animated.Value),
+  // };

   static getDerivedStateFromProps(props, state) {
     let { lineWidth, activeLineWidth, disabledLineWidth } = props;
diff --git a/node_modules/react-native-material-textfield/src/components/outline/index.js b/node_modules/react-native-material-textfield/src/components/outline/index.js
index 9347a99..9c3e8a3 100644
--- a/node_modules/react-native-material-textfield/src/components/outline/index.js
+++ b/node_modules/react-native-material-textfield/src/components/outline/index.js
@@ -11,29 +11,29 @@ export default class Line extends PureComponent {
     restricted: false,
   };

-  static propTypes = {
-    lineType: PropTypes.oneOf(['solid', 'none']),
+  // static propTypes = {
+  //   lineType: PropTypes.oneOf(['solid', 'none']),

-    disabled: PropTypes.bool,
-    restricted: PropTypes.bool,
+  //   disabled: PropTypes.bool,
+  //   restricted: PropTypes.bool,

-    tintColor: PropTypes.string,
-    baseColor: PropTypes.string,
-    errorColor: PropTypes.string,
+  //   tintColor: PropTypes.string,
+  //   baseColor: PropTypes.string,
+  //   errorColor: PropTypes.string,

-    lineWidth: PropTypes.number,
-    activeLineWidth: PropTypes.number,
-    disabledLineWidth: PropTypes.number,
+  //   lineWidth: PropTypes.number,
+  //   activeLineWidth: PropTypes.number,
+  //   disabledLineWidth: PropTypes.number,

-    focusAnimation: PropTypes.instanceOf(Animated.Value),
-    labelAnimation: PropTypes.instanceOf(Animated.Value),
-    labelWidth: PropTypes.instanceOf(Animated.Value),
+  //   focusAnimation: PropTypes.instanceOf(Animated.Value),
+  //   labelAnimation: PropTypes.instanceOf(Animated.Value),
+  //   labelWidth: PropTypes.instanceOf(Animated.Value),

-    contentInset: PropTypes.shape({
-      left: PropTypes.number,
-      right: PropTypes.number,
-    }),
-  };
+  //   contentInset: PropTypes.shape({
+  //     left: PropTypes.number,
+  //     right: PropTypes.number,
+  //   }),
+  // };

   borderProps() {
     let {

Patch Package for react-native-star-rating:

diff --git a/node_modules/react-native-star-rating/StarButton.js b/node_modules/react-native-star-rating/StarButton.js
index b6db613..8a62f5a 100644
--- a/node_modules/react-native-star-rating/StarButton.js
+++ b/node_modules/react-native-star-rating/StarButton.js
@@ -1,6 +1,7 @@
 // React and react native imports
 import React, { Component } from 'react';
-import { Image, StyleSheet, ViewPropTypes } from 'react-native';
+import { Image, StyleSheet } from 'react-native';
+import {ViewPropTypes} from 'deprecated-react-native-prop-types';
 import PropTypes from 'prop-types';
 import { createIconSetFromIcoMoon } from 'react-native-vector-icons';

diff --git a/node_modules/react-native-star-rating/StarRating.js b/node_modules/react-native-star-rating/StarRating.js
index 7aecc95..de6397c 100644
--- a/node_modules/react-native-star-rating/StarRating.js
+++ b/node_modules/react-native-star-rating/StarRating.js
@@ -1,6 +1,7 @@
 // React and react native imports
 import React, { Component } from 'react';
-import { View, ViewPropTypes, StyleSheet } from 'react-native';
+import { View, StyleSheet } from 'react-native';
+import {ViewPropTypes} from 'deprecated-react-native-prop-types';
 import PropTypes from 'prop-types';
 import { View as AnimatableView } from 'react-native-animatable';

SharanGoharKhan commented 1 year ago

@MuhammadAdnan111 thank you issue has been resolved and merged to main

enatega / food-delivery-singlevendor