react-native-splash-screen
react-native-splash-screen copied to clipboard
App runs but does not show splash screen. Calling hide() gives error: Cannot read property 'hide' of null
Run react-native info
in your project and share the content.
System: OS: Windows 10 10.0.19044 CPU: "(12) x64 AMD Ryzen 5 3600X 6-Core Processor " Memory: 1.30 GB / 15.91 GB Binaries: Node: version: 18.17.1 path: C:\Program Files\nodejs\node.EXE Yarn: Not Found npm: version: 9.6.7 path: C:\Program Files\nodejs\npm.CMD Watchman: Not Found SDKs: Android SDK: Not Found Windows SDK: AllowAllTrustedApps: Disabled IDEs: Android Studio: AI-223.8836.35.2231.10671973 Visual Studio: Not Found Languages: Java: 11.0.20 Ruby: Not Found npmPackages: "@react-native-community/cli": Not Found react: installed: 18.2.0 wanted: 18.2.0 react-native: installed: 0.72.4 wanted: 0.72.4 react-native-windows: Not Found npmGlobalPackages: "react-native": Not Found Android: hermesEnabled: true newArchEnabled: false iOS: hermesEnabled: Not found newArchEnabled: Not found
What react-native-splash-screen
version are you using?
3.3.0
What platform does your issue occur on? (Android/iOS/Both)
Android
Describe your issue as precisely as possible :
- Steps to reproduce the issue or to explain in which case you get the issue I did all the steps of the installation process and example usage except the linking part (because of autolinking). I added the splash component, hid all of my other screens, and commented out the hide() function to see if the app could show the splash screen, but it only showed a white screen. After adding the hide() function, the app showed an error: Cannot read property 'hide' of null. I also tried manual linking but it did not work either.
- Interesting
logs
Join a screenshot or video of the problem on the simulator or device?
Show us the code you are using? It's basically the same code provided in the installation guide without the manual linking.
Facing the same issue with Android: hermesEnabled: true newArchEnabled: true Any help?
That part of code is usually very simple:
import SplashScreen from 'react-native-splash-screen';
SplashScreen.hide();
If you are using the default import like this it should work.
If you are getting an error that SplashScreen
is null then something is just wrong with the way you are importing the module.
Hey @bakedchim, Did you find any solution? I am also facing the same issue.
@Karthik-V26 Sorry for the late reply. I reversed the installation and did it on another machine and somehow everything worked. Not sure what was the problem because I did the same thing again without any changes. I was lucky I was not deep into the changes so I could reverse them.
import SplashScreen from 'react-native-splash-screen';
useEffect(() => { if (SplashScreen) { SplashScreen.hide(); } }, []);
// I face the same problem, now it,s works for me
Try this:
useEffect(() => { // Hide the splash screen after 2 seconds const timer = setTimeout(() => { if(SplashScreen){ SplashScreen.hide(); } }, 2000);
// Clear the timer on component unmount
return () => clearTimeout(timer);
}, []);