"Ошибка: неизвестный именованный модуль", загрузка реактивного образа с динамического пути

Когда я использую компонент Image в React-native, он отлично работает, когда я объявляю свой путь/источник изображения как встроенную строку:

 <Image
    style={styles.img}
    source={require('mypic.png')}
 />

Но когда я определяю путь как переменную вроде этого:

 var img = 'mypic.png';
 <Image
    style={styles.img}
    source={require(img)}
 />

... это не работает. Ошибка msg: "Ошибка: неизвестный именованный модуль mypic.png"

У меня много изображений, и мне нужно динамически их требовать. Слишком много, чтобы писать инструкции для импорта вручную, чтобы требовать их по одному.

Даже с простым переключателем, подобным этому, он намного менее эффективен:

var icon = this.props.active ? require('./my-icon-active.png') : require('./my-icon-inactive.png');

Как обычно люди решаются для динамической загрузки переменных изображений?

Ответ 1