Importing custom fonts in Laravel 8

user_6897713 0
Viewed 1551

I'm trying to load custom fonts to my project using Laravel 8 (mix) but don't know what's wrong with my process. Whenever I'm trying to use the font with my scss the font seems not working.

Here's what my directory tree looks like atm:

My Public Directory

public

  • assets
    • css
    • js
  • css
    • app.css
  • js
    • app.js

My Resources Directory

resources

  • fonts
    • opensans.ttf
  • sass
    • app.scss

Now the app.scss contains the following

$font-path: "../fonts";
@font-face {
    src: url("#{$font-path}/OpenSans-Regular.ttf") format("ttf");
    font-family: "OpenSans";
}

I even tried putting the fonts inside public folder but it didn't work, also I tried importing the font from google fonts it didn't work too.

laravel-mix laravel sass fonts
1 Answers

You need to add a rule copy folder with fonts in laravel.mix.js to public/fonts

mix.copy('resources/fonts', 'public/fonts');
user_86604270
Related