During the development process, we sometimes need to add our custom fonts. For example, I had to develop a government website that should be in Nepali. So, I had to import custom fonts. Importing fonts is easy in laravel. Here we implement 2 methods i.e. using laravel-mix and without using laravel-mix.
Without laravel-mix
If we don’t want to use laravel-mix, we can directly place custom fonts in public/fonts/ directory and access in our css or blade file.
// Accessing in Blade File
Using Laravel Mix
Laravel Mix https://laravel.com/docs/5.5/mix provides a fluent API for defining webpack build steps for your application using several common CSS and JavaScript pre-processors. As defined, we can manage all our assets i.e. javascript, CSS, fonts using laravel mix. For this, we only need to edit our webpack.mix.js file on root directory.
// webpack.mix.js
// resources/assets/fonts directory contains our fonts file
// copyDirectory helps to copy all the files with directory structure
// then we can import our custom fonts as in above mentioned method in blade or css file
mix.copyDirectory('resources/assets/fonts', 'public/fonts');
If you have any comments, please drop in the comment section below.
