In dit artikel leg ik uit hoe je Font Awesome free kan installeren in een Laravel 8 applicatie.
Node package
Installeer de gratis Font Awesome node packages:
npm install @fortawesome/fontawesome-free
Sass optie toevoegen
We gaan de Font Awesome library inladen via Sass. Voeg in ./webpack.mix.js het volgende toe:
.sass('resources/sass/custom.scss', 'public/css');
Custom.scss toevoegen
Maak in ./resources/ een folder ‘sass’ aan. In deze folder een bestandje met de bestandsnaam custom.scss
Zet het volgende in custom.scss
@import "node_modules/@fortawesome/fontawesome-free/scss/fontawesome";
@import "node_modules/@fortawesome/fontawesome-free/scss/regular";
@import "node_modules/@fortawesome/fontawesome-free/scss/solid";
@import "node_modules/@fortawesome/fontawesome-free/scss/brands";
Laravel mix compilen
In de command line, voer het volgende uit:
npm run dev
Custom.css
We moeten alleen de gecompilde stylesheet toevoegen in de html. In ./resources/views/layouts/app.blade.php, voeg de volgende regel toe in de header.
<link rel="stylesheet" href="{{ asset('css/custom.css') }}">
Ready!
Je zou nu Font Awesome moeten kunnen gebruiken. Voor alle icoontjes zie https://fontawesome.com/icons?d=gallery&p=2&m=free