title: React: How do I import dynamically using if statements?
body: <p>I'm trying to understand how I can import my favicon based on the current language of the app. I followed the answer of @thecodejack <a href="https://stackoverflow.com/questions/35914712/es6-conditional-dynamic-import-statements/37170579">here</a>, but it still returns an error:<br/><br/>
  'faviconApple' is not defined<br/>
  'favicon32x32' is not defined<br/>
  ...<br/>
  What am I doing wrong?<br/></p>
  
  <h2>What I've tried</h2>
  
  <pre><code>  if(this.state.language === 'nl') {
    import ('./library/imgs/favicon/nl/apple-touch-icon.png')
    .then((faviconApple)) 
    import ('./library/imgs/favicon/nl/favicon-32x32.png')
    .then((favicon32x32)) 
    import ('./library/imgs/favicon/nl/favicon-16x16.png')
    .then((favicon16x16)) 
    import ('./library/imgs/favicon/nl/safari-pinned-tab.svg')
    .then((faviconSafari)) 
    import ('./library/imgs/favicon/nl/favicon.ico')
    .then((favicon)) 
  } else if(this.state.language === 'fr') {
    import ('./library/imgs/favicon/fr/apple-touch-icon.png')
    .then((faviconApple)) 
    import ('./library/imgs/favicon/fr/favicon-32x32.png')
    .then((favicon32x32)) 
    import ('./library/imgs/favicon/fr/favicon-16x16.png')
        .then((favicon16x16)) 
    import ('./library/imgs/favicon/fr/safari-pinned-tab.svg')
        .then((faviconSafari)) 
    import ('./library/imgs/favicon/fr/browserconfig.xml')
  .then((faviconBrowserconfig)) 
  } else if(this.state.language === 'en') {
    import ('./library/imgs/favicon/en/apple-touch-icon.png')
        .then((faviconApple)) 
    import ('./library/imgs/favicon/en/favicon-32x32.png')
        .then((favicon32x32)) 
    import ('./library/imgs/favicon/en/favicon-16x16.png')
        .then((favicon16x16)) 
    import ('./library/imgs/favicon/en/safari-pinned-tab.svg')
        .then((faviconSafari)) 
    import ('./library/imgs/favicon/en/favicon.ico')
        .then((favicon)) 
  }
  </code></pre>