Has anyone managed to add a local font successfully?
I’ve added font files to UI/fonts and defined them in fonts.scss, and it works on the site locally. But on the dev site the new font isn’t visible. When I inspect I can see that no new font files have been loaded.
UI folder is the build output folder and you should not put files there manually. The webpack build step will produce files in that folder.
To add fonts, please create a folder /Client/fonts then place font files there.
Then modify /Client/webpack/webpack.common.js to copy font files when building, by modifying CopyWebpackPlugin config:
from
new CopyWebpackPlugin([
{ from: 'images', to: path.resolve(BUILD_DIR, 'images') }
]),
to
new CopyWebpackPlugin([
{ from: 'images', to: path.resolve(BUILD_DIR, 'images') },
{ from: 'fonts', to: path.resolve(BUILD_DIR, 'fonts') }
]),
Make sure your fonts.scss files has the correct Url to files under /UI/fonts/ folder. Now when executing yarn build or yarn prod, files under /Client/fonts/ will be copied to /UI/fonts/