vue.jsmaterial-designbuefymaterial-design-icons

Buefy Material Design icons not showing using b-icon component

I'm a first time Buefy user.
When I tried to use the b-icon component,
I was confused when I saw that the icon doesn't show,
instead it just showed an empty block element, as if the icon was there.

I tried using a different icon pack but that also didn't work.

Solution

  • What the official Buefy documentation doesn't tell you is that you have to install the Material Design package, then import it in your main.js file.

    npm i @mdi/font

    import '@mdi/font/css/materialdesignicons.css'

    I'm guessing that for a different icon pack you just need to do the same with the relevant package.