0

In font awesome, you use webpack to import different styles of the same icon like the following: 

import fontawesome from '@fortawesome/fontawesome'
import faUserSolid from '@fortawesome/fontawesome-free-solid/faUser'
import faUserRegular from '@fortawesome/fontawesome-free-regular/faUser'

fontawesome.library.add(faUserSolid)
fontawesome.library.add(faUserRegular)

Example adapted from documentation

I'm interested in trying to import all the styles at the same time. My goal is to do something like this:

['faUser'].forEach(function(icon) {
  import i from '@fortawesome/fontawesome-free-solid/${icon}'
  fontawesome.library.add(i)
  import i from '@fortawesome/fontawesome-free-regular/${icon}'
  fontawesome.library.add(i)
})

I'm aware I can not use conditionals or loops with import. Above is just my best example of pseudo code. I think I have to use webpack's dynamic imports but I'm not sure how to adapt the example using webpack chunk name.

sunnyrjuneja
  • 6,033
  • 2
  • 32
  • 51
  • Hi Sunny, it appears your question is a duplicate of this [dynamic import](https://stackoverflow.com/q/35914712/1252541) question, where the answer is effectively "no, you can't dynamically import." You may be able to pull something off with require, though. – shortstuffsushi Apr 17 '18 at 22:41
  • Hey shortstuff, I'm aware I can not use dynamic imports in the way I described. I'm almost certain I have to use chunks as described the url labeled dynamic imports but I'm not at all sure how I would go about doing that which is why I came here – sunnyrjuneja Apr 17 '18 at 22:44
  • Ah, ok. I'm not familiar with the webpack concept for dynamic imports, but based on their example there, what have you tried? It doesn't look like their recommendation eliminates the need to actually type in all the imports you want, it's just moved into a comment and then presumably handled by some pre-processor in webpack. – shortstuffsushi Apr 17 '18 at 22:50

0 Answers0