javascript - 从 Font Awesome 导入许多图标

Question

我正在导入许多 FA 图标：

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)

如何声明该列表一次然后重新使用它？它会是一个数组吗？或者一个对象……什么？

我刚在想

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'

但这当然行不通。我会做什么library.add()？

后面那个看起来像物体的东西是import什么？

标签： javascriptecmascript-6destructuringjavascript-import

Answer 1

一种解决方案是创建一个新模块来导出您的特定图标。

// 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';

然后您可以简单地导入您的新模块并使用扩展语法使用它。

// library.js
import {library} from '@fortawesome/fontawesome-svg-core'

import * as icons from './icons';

library.add(...Object.values(icons));