And for those using TypeScript, create a fonts.d.ts file in /src folder and include the font extensions you want to import, like below ↓↓↓:
declare module '*.woff'; declare module '*.ttf';
Update - September 2021 | TTF and OTF Fonts:
Don't write formats like format('ttf') or format('otf'), because it is not gonna work.
If you are using TTF or OTF fonts, in the format options of @font-face, you should write as: format('truetype'); format('opentype');
Don't use spaces when naming your font files Wrong: My Awesome Font.ttf Right: MyAwesomeFont.ttf
That's it! Now your project's Typescript understands fonts.
I created an account on this website just to like this and say thank you. Been tearing out my hair trying to figure out why this darned font wouldn't load-- it was because of the spaces. Thank you for this.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Thank yooouuuuu!!!! ♥♥♥
And for those using TypeScript, create a
fonts.d.ts
file in /src folder and include the font extensions you want to import, like below ↓↓↓:declare module '*.woff';
declare module '*.ttf';
Don't write formats like
format('ttf')
orformat('otf')
, because it is not gonna work.If you are using TTF or OTF fonts, in the format options of
@font-face
, you should write as:format('truetype');
format('opentype');
Don't use spaces when naming your font files
Wrong:
My Awesome Font.ttf
Right:
MyAwesomeFont.ttf
That's it! Now your project's Typescript understands fonts.
I created an account on this website just to like this and say thank you. Been tearing out my hair trying to figure out why this darned font wouldn't load-- it was because of the spaces. Thank you for this.