This should have been easier, but I must have misunderstood how this works.
After upgrading to Bootstrap 4, for some reason my node_modules
didn’t contain fontawesome anymore. I don’t know what I did, but I took it as a sign to upgrade to fontawesome 5.
This was a little tricky to follow at first as it works differently to fontawesome 4.
Install fontawesome, install the libraries you want to use so they can be used in Bootstrap.
$ npm i --save @fortawesome/fontawesome $ npm i --save @fortawesome/fontawesome-free-solid $ npm i --save @fortawesome/fontawesome-free-regular $ npm i --save @fortawesome/fontawesome-free-brands
In your resources/assets/js/bootstrap.js
:
require('@fortawesome/fontawesome');
require('@fortawesome/fontawesome-free-solid');
require('@fortawesome/fontawesome-free-regular');
require(‘@fortawesome/fontawesome-free-brands’);
Compile it using dev or watch.
$ npm run dev
That’s it. Now you can use the class="fa fa-..."
tags as expected. You might find some of your existing fa’s are no longer included free. So checkout the fontawesome site and choose icons to replace them with.
References
https://fontawesome.com/icons?d=gallery&m=free
If you want to add icons for facebook or instagram add this as well
require(‘@fortawesome/fontawesome-free-brands’);
to resources/assets/js/bootstrap.js
LikeLike
A worthwhile addition, but as my need is internal at the minute I have no need of ‘brands’. But you’re quire correct very useful for all sorts of stuff like paypal etc. https://fontawesome.com/icons?d=gallery&s=brands
LikeLike
I think all icons are there,
https://fontawesome.com/how-to-use/on-the-web/setup/upgrading-from-version-4
You just need to import all icons and use the correct nomenclature, “fa”, “far” and “fab”
LikeLike
Only if you upgrade to the new svg style from v4. Then you can use the fas, far, fab formats.
LikeLike
0 Pingbacks