'Error: Unknown named module', loading react-native image from a dynamic path
<p>When i use the Image component in React-native, it works fine when I declare my image's path/source as an inline string：</p>

<pre><code> &lt;Image
    style={styles.img}
    source={require('mypic.png')}
 /&gt;
</code></pre>

<p>But when I define the path as a variable like this:</p>

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

<p>...it doesn't work. The error msg is "Error: unknown named module 'mypic.png'"</p>

<p>I have many images, and I need to require them dynamically. There are too many to write manual import statements to require them one-by-one. </p>

<p>Even with a simple toggle like this one, it's far less efficient:</p>

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

<p></p>

<p>How do people usually solve for dynamic loading of variable images?</p>