Imported image format incompatible between web and native

[bunnyfly]

I have a create-react-app project and trying to import an image according to the docs. But <Image>'s source format is different between iOS, Android, and web.

For example, this is working for me in iOS:

import imageBackground from '../assets/image/background.png';
...
<Image style={styles.image} source={imageBackground} />
...
const styles = StyleSheet.create({
 image: {
   height: 100,
   width: 100,
 },
});

But web only works if I reformat the imageBackground import like so:

<Image style={styles.image} source={{uri: imageBackground}} />

But then of course, it breaks on iOS. Some folks suggest customizing the webpack config, but the create-react-app says you can't do that. So how do you get <Image> to work cross-platform with create-react-app?