React-Native assets not loading - errors not clear

user_5081265 0
Viewed 1580

I am using React-native along with AWS Amplify and AWS AppSync with GraphQL. When I load my app in the ios simulator with the command npx react-native ios the app loads, but it is not loading the assets.

If I inspect and click on something like App or Navigator I get the following errors. I'm not sure if they are related. I had this working and without changing any code this started happening.

Here is an example of how I'm trying to load an asset:

<TouchableOpacity style={styles.write} onPress={() => this.toggleWritePopup()}> <Image source={require('../assets/writeicon.png')} />

error in simulator from inspect element

Edit: Here is the output for react-native info

System:
OS: macOS 10.15.6
CPU: (4) x64 Intel(R) Core(TM) i5-7267U CPU @ 3.10GHz
Memory: 6.88 GB / 16.00 GB
Shell: 5.7.1 - /bin/zsh
 Binaries:
Node: 12.18.3 - /usr/local/bin/node
Yarn: Not Found
npm: 6.14.6 - /usr/local/bin/npm
Watchman: 4.9.0 - /usr/local/bin/watchman
Managers:
CocoaPods: 1.9.3 - /usr/local/bin/pod
SDKs:
iOS SDK:
  Platforms: iOS 14.0, DriverKit 19.0, macOS 10.15, tvOS 14.0, watchOS 7.0
Android SDK: Not Found
IDEs:
Android Studio: Not Found
Xcode: 12.0/12A7209 - /usr/bin/xcodebuild
Languages:
Java: 12.0.1 - /usr/bin/javac
Python: 2.7.16 - /usr/bin/python
npmPackages:
@react-native-community/cli: Not Found
react: 16.9.0 => 16.13.1
react-native: ^0.62.2 => 0.63.3
react-native-macos: Not Found
npmGlobalPackages:
*react-native*: Not Found

Edit: This is another section of code where this png is also not loading. So even with the dimensions it does not work:

 <ImageBackground
      source={require('../assets/blue_ocean.png')}
      style={{width: '100%', height: '100%'}}>
aws-appsync aws-amplify react-native
2 Answers

I came across this a while back and in my case the errors were because the reactNode sent to the scrollToFocusedInput were null.

Trace/debug the scrollToFocusedInput method and/or do a console.log(event, reactNode).

This could have been caused because you did not use the default SDK install path or because the JS bundle is referred to your dev machine rather than the local device.

If you are running on emulator, make sure the emulator has default settings and access to the emulated baseband (cellular turned on). Turning stuff off on emulator can cause weird build behavior.

user_66726790

Ok I finally figured it out. It was the iOS version that was running in the simulator. For whatever reason my code doesn't seem to work for iOS 14.0. If I set it to a earlier version my assets load with no issue.

user_50812650
Related