React-native-splash-screen: Compatibility with React Native v0.60

Created on 5 Jul 2019  ·  16Comments  ·  Source: crazycodeboy/react-native-splash-screen

There is a plan to adapt react-native-splash-screen to be compatibility with React Native v0.60. The current version of is not compatible with React Native v0.60

Most helpful comment

you can add jettifier as a dev dependency like this

yarn add jetifier --dev

then add the script to your package.json

  "scripts": {
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint .",
    "jetify": "npx jetify"
  },

and just use it like this: yarn jetify

i'm not so sure if there was a problem with androidx since i been using the jetify for other libs, the issue for me seems to be the autolinking used by "react-native": "0.60.0"

here is some info that i found about it

https://github.com/react-native-community/cli/blob/master/docs/autolinking.md
(During the transition period some packages may not support autolinking on certain platforms. To disable autolinking for a package, update your react-native.config.js)

So after reading that i made a workaround like this:

create your react-native.config.js file with this content and add it to your app root folder

module.exports = { dependencies: { 'react-native-splash-screen': { platforms: { }, }, }, };

And now you can use the manual link(react-native link react-native-splash-screen), make sure that everything is added correctly and, don't forget to update the MainActivity.java, as pointed in the Readme,

Haven't reviewed on ios yet if anyone has and advice, let me know, i will probably give it a try tomorrow.

All 16 comments

Any update on this?

@Nics08 until there is not a RNv0.60 compatible version of react-native-splash-screen may we could try: https://github.com/mikehardy/jetifier

The propose of jetifier is: "If you use React Native modules with native Java code that isn't converted to AndroidX, and your app is AndroidX, you probably need this"

However I haven't tested jetifier yet. I'll be grateful if someone cold point another solution for now.

you can add jettifier as a dev dependency like this

yarn add jetifier --dev

then add the script to your package.json

  "scripts": {
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint .",
    "jetify": "npx jetify"
  },

and just use it like this: yarn jetify

i'm not so sure if there was a problem with androidx since i been using the jetify for other libs, the issue for me seems to be the autolinking used by "react-native": "0.60.0"

here is some info that i found about it

https://github.com/react-native-community/cli/blob/master/docs/autolinking.md
(During the transition period some packages may not support autolinking on certain platforms. To disable autolinking for a package, update your react-native.config.js)

So after reading that i made a workaround like this:

create your react-native.config.js file with this content and add it to your app root folder

module.exports = { dependencies: { 'react-native-splash-screen': { platforms: { }, }, }, };

And now you can use the manual link(react-native link react-native-splash-screen), make sure that everything is added correctly and, don't forget to update the MainActivity.java, as pointed in the Readme,

Haven't reviewed on ios yet if anyone has and advice, let me know, i will probably give it a try tomorrow.

Thks @mrcarjul with a little of patience I was able to adapt all my project dependencies libraries using your advice!

@mrcarjul did you get this to work for iOS with RN 0.60? I am still facing an error of SplashScreen being null after both having tried to unlink the package and linking it with your workaround.

@jhlabs cd ios; pod install; cd ..

@a-eid thanks. After adding the pod reference manually to the Podfile I got it to work.

But is there any plan on where this lib will work with 0.60?

I am having error for iOS: library not found for -lSplashScreen

@Badbreaddead it works on react native 0.60+. all you need to do is

  • install the lib and add code to the appDelegate.
  • cd ios; pod install ; cd .. <<

I have not tested it on android just yet, but it should be similar.

you can add jettifier as a dev dependency like this

yarn add jetifier --dev

then add the script to your package.json

  "scripts": {
    "start": "react-native start",
    "test": "jest",
    "lint": "eslint .",
    "jetify": "npx jetify"
  },

and just use it like this: yarn jetify

i'm not so sure if there was a problem with androidx since i been using the jetify for other libs, the issue for me seems to be the autolinking used by "react-native": "0.60.0"

here is some info that i found about it

https://github.com/react-native-community/cli/blob/master/docs/autolinking.md
(During the transition period some packages may not support autolinking on certain platforms. To disable autolinking for a package, update your react-native.config.js)

So after reading that i made a workaround like this:

create your react-native.config.js file with this content and add it to your app root folder

module.exports = { dependencies: { 'react-native-splash-screen': { platforms: { }, }, }, };

And now you can use the manual link(react-native link react-native-splash-screen), make sure that everything is added correctly and, don't forget to update the MainActivity.java, as pointed in the Readme,

Haven't reviewed on ios yet if anyone has and advice, let me know, i will probably give it a try tomorrow.

I'm having trouble with the MainActivity.java

MainActivity.java:3: error: package andoid.os does not exist
import andoid.os.Bundle;

Did you run into this issue too?

You have a typo you are missing the r, is android os.Bundle

🤦‍♂️

Thanks!

@Badbreaddead it works on react native 0.60+. all you need to do is

  • install the lib and add code to the appDelegate.
  • cd ios; pod install ; cd .. <<

I have not tested it on android just yet, but it should be similar.

I can confirm that I've installed SplashScreen with autolinking on RN 0.60 directly without any of the prior workarounds.

Android requires to modify the MainActivity, exactly like its described in the 3rd step of the general config

@Badbreaddead it works on react native 0.60+. all you need to do is

  • install the lib and add code to the appDelegate.
  • cd ios; pod install ; cd .. <<

I have not tested it on android just yet, but it should be similar.

I can confirm that I've installed SplashScreen with autolinking on RN 0.60 directly without any of the prior workarounds.

Android requires to modify the MainActivity, exactly like its described in the 3rd step of the general config

@jsancho It doesn't work for me. Autolinking worked fine on Android. But in iOS I am facing this issue

Undefined symbols for architecture arm64:
"OBJC_CLASS$_RNSplashScreen", referenced from:
objc-class-ref in AppDelegate.o
ld: symbol(s) not found for architecture arm64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

Undefined symbols for architecture arm64:
"OBJC_CLASS$_RNSplashScreen", referenced from:
objc-class-ref in AppDelegate.o
ld: symbol(s) not found for architecture arm64
clang: error: linker command failed with exit code 1 (use -v to see invocation)

Sorry mate, wouldn't know how to look in the internals to work this out.

In my case it was rather straightforward to setup SplashScreen.
I would recommend you to create a vanilla RN 0.60 from scratch then add Splashscreen before you do anything else.
There's a chance that If you are upgrading an older project there might be some config conflicting with the new setup?

Was this page helpful?
0 / 5 - 0 ratings