Нужно ли повторно перечислять все мои значки React Font Awesome после импорта и добавления в библиотеку? - PullRequest
Новая
       11

Нужно ли повторно перечислять все мои значки React Font Awesome после импорта и добавления в библиотеку?

0 голосов
/ 30 апреля 2019

Кажется утомительным (и, как в случае с обувью), что нужно заново вводить все мои импортированные значки в функцию library.add. Есть ли способ обойти это? 

// font-awesome-library.js

import { library } from '@fortawesome/fontawesome-svg-core'
import {
  faChartBar, faFileAlt, faBalanceScale, faUser, faFutbol, faBuilding,
  faAddressBook, faChartLine, faDatabase, faServer, faLink, faCloudUpload,
  faClipboard, faSlidersH, faChartBar, faUsers
} from '@fortawesome/pro-solid-svg-icons'
import { faFortAwesome} from '@fortawesome/free-brands-svg-icons';

// Re-listing these below seem tedious..
library.add(
  faChartBar, faFileAlt, faBalanceScale, faUser, faFutbol, faBuilding,
  faAddressBook, faChartLine, faDatabase, faServer, faLink, faCloudUpload,
  faClipboard, faSlidersH, faChartBar, faUsers, faFortAwesome, 
);

Кроме того, если я опишу импорт (или использую неправильное имя, например faBarChart вместо faChartBar), я получаю бесполезную ошибку в response-fontawesome: TypeError: Cannot read property 'prefix' of undefined: (

1 Ответ

0 голосов
/ 30 апреля 2019

Я рефакторил font-awesome-library.js в: 

// font-awesome-library.js

import { library } from '@fortawesome/fontawesome-svg-core'
import * as icons from './font-awesome-icons';

Object.keys(icons).forEach(key => {
  try {
    library.add(icons[key]);
  } catch (err) {
    console.log(key);
    debugger; // eslint-disable-line
    throw err;
  }
});

И перечислять значки нужно только один раз в font-awesome-icons.js: 

// font-awesome-icons.js

export {
  faChartBar, faFileAlt, faBalanceScale, faUser, faFutbol, faBuilding,
  faAddressBook, faChartLine, faDatabase, faServer, faLink, faCloudUpload,
  faClipboard, faSlidersH, faChartPie, faUsers
} from '@fortawesome/pro-solid-svg-icons'
export { faFortAwesome} from '@fortawesome/free-brands-svg-icons';

Кроме того, импортируя их как объект ({faChartBar, faFileAlt, /*...*/}), я могу точно знать, какой значок (из тех, которые я пытался импортировать) был назван неправильно, решая мою другую проблему.

...