I'm importing many FA icons:
import { faUsers, faCut, faBullhorn, faPenNib, faCircle, faPalette, faVolumeUp, faSmile, faGrin, faShekelSign, faTv, faUserTie, faFolder, faPaintBrush, faCircleNotch, faSignOutAlt }
from '@fortawesome/free-solid-svg-icons'
library.add(faUsers, faCut, faBullhorn, faPenNib, faCircle, faPalette, faVolumeUp, faSmile, faGrin, faShekelSign, faTv, faUserTie, faFolder, faPaintBrush, faCircleNotch, faSignOutAlt)
How can I declare that list once and then re-use it? Would it be an array? Or an object ... of what?
I was thinking
const icons = {faUsers, faCut, faBullhorn, faPenNib, faCircle, faPalette, faVolumeUp, faSmile, faGrin, faShekelSign, faTv, faUserTie, faFolder, faPaintBrush, faCircleNotch, faSignOutAlt}
import icons from '@fortawesome/free-solid-svg-icons'
But of course that doesn't work. And what would I do for library.add()
?
What is that object-looking thing that follows import
?
One solution is to create a new module that exports your specific icons.
// icons.js
export {
faUsers,
faCut,
faBullhorn,
faPenNib,
faCircle,
faPalette,
faVolumeUp,
faSmile,
faGrin,
faShekelSign,
faTv,
faUserTie,
faFolder,
faPaintBrush,
faCircleNotch,
faSignOutAlt
} from '@fortawesome/free-solid-svg-icons';
Then you can simply import your new module and consume it using spread syntax or use it directly.
// library.js
import {library} from '@fortawesome/fontawesome-svg-core'
import * as icons from './icons';
// using the spread syntax
library.add(...Object.values(icons));
// or using the variable directly
library.add(icons);