Release build crashes on iOS and Android. Fatal Exeption.

[YeshanJay]

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
OS: macOS Sierra 10.12.6
Node: 8.4.0
Yarn: Not Found
npm: 5.4.1
Watchman: 4.9.0
Xcode: Xcode 8.3.3 Build version 8E3004b
Android Studio: 2.3 AI-162.4069837

Packages: (wanted => installed)
react: 16.0.0-beta.5 => 16.0.0-beta.5
react-native: ^0.49.3 => 0.49.3

Target Platform: iOS (8.0) Android (26)

Steps to Reproduce

1. For iOS, open xcode and open the project.
2. Setup release configurations.
3. Connect a device, and click on run to deploy into device.
4. An exception occurs with reason as follows:

'Unhandled JS Exception: undefined is not an object (evaluating 's.View.prop..., stack:
<unknown>@663:2841
i@2:553
<unknown>@661:243
i@2:553
<unknown>@660:153
i@2:553
<unknown>@304:251
i@2:553
<unknown>@12:38
i@2:553
n@2:266
global code@671:9

5. For Android, setup release configurations.
6. Open the Terminal and run: sudo react-native run-android --variant=release.
7. After the build is successful, the app is deployed to the connected device, then crashes with the following message (from logs):

--------- beginning of crash
10-27 17:52:08.151 18268-18313/? E/AndroidRuntime: FATAL EXCEPTION: mqt_native_modules
	Process: com.storefinder_yj, PID: 18268
	com.facebook.react.common.JavascriptException: undefined is not an object (evaluating 's.View.propTypes.style'), stack:
	   <unknown>@659:2841
	   i@2:565
	   n@2:348
	   t@2:210
	   <unknown>@657:243
	   i@2:565
	   n@2:348
	   t@2:210
	   <unknown>@656:153
	   i@2:565
	   n@2:348
	   t@2:210
	   <unknown>@302:251
	   i@2:565
	   n@2:348
	   t@2:210
	   <unknown>@12:38
	   i@2:565
	   n@2:278
	   t@2:210
	   global code@667:9
	   
		   at com.facebook.react.modules.core.ExceptionsManagerModule.showOrThrowError(ExceptionsManagerModule.java:56)
		   at com.facebook.react.modules.core.ExceptionsManagerModule.reportFatalException(ExceptionsManagerModule.java:40)
		   at java.lang.reflect.Method.invoke(Native Method)
		   at com.facebook.react.bridge.JavaMethodWrapper.invoke(JavaMethodWrapper.java:363)
		   at com.facebook.react.bridge.JavaModuleWrapper.invoke(JavaModuleWrapper.java:162)
		   at com.facebook.react.bridge.queue.NativeRunnable.run(Native Method)
		   at android.os.Handler.handleCallback(Handler.java:751)
		   at android.os.Handler.dispatchMessage(Handler.java:95)
		   at com.facebook.react.bridge.queue.MessageQueueThreadHandler.dispatchMessage(MessageQueueThreadHandler.java:31)
		   at android.os.Looper.loop(Looper.java:154)
		   at com.facebook.react.bridge.queue.MessageQueueThreadImpl$3.run(MessageQueueThreadImpl.java:194)
		   at java.lang.Thread.run(Thread.java:761)


10-27 17:52:08.591 18268-18312/? E/ReactNativeJS: Module AppRegistry is not a registered callable module (calling unmountApplicationComponentAtRootTag)

8. Following are the dependencies in package.json file:

"dependencies": {
	"datejs": "^1.0.0-rc3",
	"prop-types": "^15.6.0",
	"react": "16.0.0-beta.5",
	"react-native": "^0.49.3",
	"react-native-elements": "^0.17.0",
	"react-native-fbsdk": "^0.6.3",
	"react-native-sqlite-2": "^1.5.0",
	"react-native-vector-icons": "^4.4.2",
	"react-navigation": "^1.0.0-beta.15",
	"rn-viewpager": "^1.2.4"
}

Expected Behavior

Application should run on the device without any crashes (in release mode).

Actual Behavior

Application builds successfully and deploys onto device. Then the app crashes once it opens.
Screen shots are not available since the app crashes and closes, or is just a blank screen.

Reproducible Demo

Unable to create a reproducible demo.

[ujwal-setlur]

This is clearly showing that some package is still using View.propTypes. I was running into this too until I did find the offending packages. Please do the following:

1. find node_modules -name "*.map" | xargs -n 1 rm -f
2. grep -R "View.propTypes" node_modules

The first step removes all the map files so that your grep output is not flooded. You will need to reinstall node_modules later so that you get them back.

Please check thoroughly the output of the second. You can either post output here or send them to me privately. I just went through the pain myself and would like to help you.

[ujwal-setlur]

Did you check just your dependencies or the sub-dependencies of your dependencies?

[YeshanJay]

I checked only my dependencies.

I ran the commands you mentioned, and the second one printed a bunch of lines. And seems like View.propTypes is still being used in some of my dependencies (last time I only glanced around for React.propTypes).

These are the packages listed: react-native-elements, rn-viewpager

Thank you very much for helping out 😄

[ujwal-setlur]

No worries. You have to check the entire dependency tree for

1. React.PropTypes
2. PropTypes being imported from react
3. Usage of View.propTypes

All three are illegal in React 16. The fixes for those are respectively:

1. React.PropTypes -> PropTypes (import PropTypes from 'prop-types')
2. Import PropTypes from prop-types instead of react
3. View.propTypes -> ViewPropTypes (import ViewPropTypes from 'react-native')

My approach was this. Check each of those projects on GitHub and see:

1. Has it been fixed in git already? Is there a new version available? If not, use the code from the github repo in your package.json
2. Has someone issued a pull request for this? If so, use that branch.
3. Fork the GitHub repo and fix it yourself

I had to do all three :). The tricky part was when the direct dependency was clean, but a sub-dependency was not. I then had to fork both the direct dependency and its sub-dependency, fix the issue in the sub-dependency fork, change the my fork of the main dependency to use my fork of the sub-dependency.

As you can see, a bloody pain in the proverbial backside! But once I figured out the problem, it took me just a few hours to hit them all.

Good luck!

[YeshanJay]

hahaha.. I can only imagine what you went through. Thanks a lot again for saving so many hours mine 😄

[ujwal-setlur]

For anyone using code-push and running into app crashes on launch, see this:

microsoft/react-native-code-push#1064

[arma7x]

I'm downgrade to RN 0.45.1 to solve this.

[YeshanJay]

I downgraded to RN 0.48.4 for now.

[iLevye]

In my case, upgrading react-native-admob 1.3.2 to 2.0.0-beta.2 solved situation.

[hironarita]

undefined is not an object (evaluating 'a.propTypes.style')

This is the error I get. I used grep -R 'a.propTypes.style' node_modules and it doesn't even find an instance where this code is executed... I'm confused.

[ujwal-setlur]

Don't include the 'a'. Please grep for propStyles.style? Is it attached to a View object? In my experience, it is one of the following:

1. PropStyles imported from react
2. Usage of React.PropStyles
3. Usage of View.propStyles

Please check thoroughly for all three.

[ujwal-setlur]

Also check your own code

[hironarita]

@ujwal-setlur My grep for 'View.propTypes' outputs a lot of examples like style: ViewPropTypes ? ViewPropTypes.style : View.propTypes.style. Did you have to remove those too?