Font Awesome Pro Icons not working in React - reactjs

Question

I have font awesome pro installed in my project but the pro icons are not showing up in my project. The free version works fine.
import React from 'react';
import ProfileCard from './ProfileCard';
import { FontAwesomeIcon } from '#fortawesome/react-fontawesome';
import { faCalendar } from '#fortawesome/free-solid-svg-icons';
const MeetingStart = () => {
return (
<div className="mt-2 p-4">
<h4>Group Name</h4>
<div className="row d-flex justify-content-between">
<h2>Welcome</h2>
<div className="meeting-date row mr-2">
<FontAwesomeIcon icon={faCalendar} />
<FontAwesomeIcon icon="fa-regular fa-memo" />
<p>{new Date().toDateString().slice(0, 10)}</p>
</div>
</div>
</div>
);
};
export default MeetingStart;
In this example faCalendar works but fa-memo doesn't. I tried re-installing the packages but that didn't seem to change anything.
Link to docs:
https://fontawesome.com/docs/web/use-with/react/

Answer 1

Have you already checked to have all the dependencies installed for the pro version?
FONTAWESOME_NPM_AUTH_TOKEN=FONT-AWESOME-PACKAGE-TOKEN npm install --save #fortawesome/fontawesome-pro
npm i --save #fortawesome/pro-solid-svg-icons
npm i --save #fortawesome/pro-regular-svg-icons
npm i --save #fortawesome/pro-light-svg-icons
npm i --save #fortawesome/pro-thin-svg-icons
npm i --save #fortawesome/pro-duotone-svg-icons
npm i --save #fortawesome/react-fontawesome#latest