I'm creating a React Native module along-side a React Native application. Everything with the module works as expected until I introduce images that should exist in the package and not in the application.
Any image from the package does not display in the consuming application.
(Option 1): Including image asset
const image = require('./assets/background.jpg');
const config = {
styleConfig: {
background: {
images: {
primary: image
},
...
}
export config;
If I include config in the consuming application, everything else works as expected (strings, components, etc) until I try to include <Image source={config.styleConfig.background.images.primary} /> (normally would get this info in a nicer format but for the sake of explanation showing the full path and not any of the abstractions). This does not throw an error but displays a blank image.
(Option 2): Including image component
Once it seemed like including the asset was not working, I created an Image component that used the required image directly and exported this. This also displayed a block the size of the image but did not show the asset. If I do this same operation but create the component and load the asset from the consuming application all is well.