Preload font file with hashed name

Viewed 153

I am using React application and has below font files

enter image description here

but on generating the build, react creates the font files with hashed names as below:

enter image description here

When I run the application over lighthouse, it suggests me to preload these files.
But I am not able to figure out how can I preload files with having hashed names.

1 Answers

There is no real way of doing that with react but there are work arounds. The one I'm using is in the index.html located in the public directory I add a

<div style="opacity: 0">
  <span style="font-family: 'FiraGO';"></span>
</div>

You can add as many font families as necessary with this, just make sure you also load the necessary font sources properly in your App.js.

Related