Как добавить потрясающую иконку в моем приложении React JHipster?

Question

Я занимаюсь разработкой приложения с использованием JHipster React.

Теперь мне нужно добавить иконку c для запуска. Этот значок можно найти здесь: [https://fontawesome.com/icons/running?style=solid.] .

Answer 1

Я исследовал проект Jhipster и обнаружил, как это сделать сам. Чтобы сделать это самостоятельно, выполните следующие действия:

1) Go в каталог @fontawesome, бесплатный каталог -1022 * -svg-icons в каталоге node_modules:

2) Найдите нужное изображение (используйте https://fontawesome.com/icons в качестве основы для получения указанного вами c изображения)

3) Добавьте ваше изображение в / WebAPP / приложение / Config / значок-loader.ts. Я добавил для бегового изображения:

import { faRunning } from '@fortawesome/free-solid-svg-icons/faRunning';
...
  library.add(
    faSort,
    faEye,
    faSync,
    faBan,
    faTrash,
    faArrowLeft,
    faSave,
    faPlus,
    faPencilAlt,
    faUser,
    faTachometerAlt,
    faHeart,
    faList,
    faTasks,
    faBook,
    faHdd,
    faLock,
    faSignInAlt,
    faSignOutAlt,
    faWrench,
    faThList,
    faUserPlus,
    faAsterisk,
    faFlag,
    faBell,
    faHome,
    faRoad,
    faCloud,
    faTimesCircle,
    faSearch,
    faRunning
  );

4) Используйте значок в своем коде, сначала импортируйте, а затем возьмите его по имени, которое вы найдете в https://fontawesome.com/icons

import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';