LaVOZs

The World’s Largest Online Community for Developers

'; Add a fa-icon in JHipster - LavOzs.Com

My goal: use a fa-icon which as not been imported yet by JHipster

My try: add the fa-icon GrinHearts manually in the app.vendor.ts file using the following code and then run yarn run webpack:build command

/* after changing this file run 'yarn run webpack:build' */
/* tslint:disable */
import '../content/css/vendor.css';

// Imports all fontawesome core and solid icons

import { library } from '@fortawesome/fontawesome-svg-core';
import {
    faUser,
    faSort,
    faSync,
    faEye,
    faBan,
    faTimes,
    faArrowLeft,
    faSave,
    faPlus,
    faPencilAlt,
    faBars,
    faThList,
    faUserPlus,
    faRoad,
    faTachometerAlt,
    faHeart,
    faList,
    faBell,
    faBook,
    faHdd,
    faFlag,
    faWrench,
    faClock,
    faCloud,
    faSignOutAlt,
    faSignInAlt,
    faCalendarAlt,
    faSearch,
    faTrashAlt,
    faAsterisk,
    faTasks,
    faHome,
    faGrinHearts
} from '@fortawesome/free-solid-svg-icons';

// Adds the SVG icon to the library so you can use it in your page
library.add(faUser);
library.add(faSort);
library.add(faSync);
library.add(faEye);
library.add(faBan);
library.add(faTimes);
library.add(faArrowLeft);
library.add(faSave);
library.add(faPlus);
library.add(faPencilAlt);
library.add(faBars);
library.add(faHome);
library.add(faThList);
library.add(faUserPlus);
library.add(faRoad);
library.add(faTachometerAlt);
library.add(faHeart);
library.add(faList);
library.add(faBell);
library.add(faTasks);
library.add(faBook);
library.add(faHdd);
library.add(faFlag);
library.add(faWrench);
library.add(faClock);
library.add(faCloud);
library.add(faSignOutAlt);
library.add(faSignInAlt);
library.add(faCalendarAlt);
library.add(faSearch);
library.add(faTrashAlt);
library.add(faAsterisk);
library.add(faGrinHearts);

// jhipster-needle-add-element-to-vendor - JHipster will add new menu items here

My issue: I get this error

ERROR in /src/main/webapp/app/vendor.ts (41,5): Module '"/node_modules/@fortawesome/free-solid-svg-icons/index"' has no exported member 'faGrinHearts'.

Could somebody help me please?

Thanks!

You need to update your @fortawesome/free-solid-svg-icons package, the FaGrinHearts icon is not included in v5.1.0-8, only in v5.1.0+. I'd recommend using the latest version, which is v5.2.0. You can see the versions and the order they were released on npmjs

Related
Add custom view to jhipster app
add a custom view to JHipster app
jhipster : Running karma tests on component with external template
How to display icons in JHipster 5?
JHipster 5.2.0, error with angular-fontawesome
Acces to Principal outside the 'router-outlet' in main component in JHipster Angular
'node_modules/ngx-webstorage/ngx-webstorage' has no exported member 'Ng2Webstorage'
Including custom typings in JHipster (v5.82) project