quasarframework / quasar

Quasar Framework - Build high-performance VueJS user interfaces in record time
https://quasar.dev
MIT License
25.92k stars 3.52k forks source link

Qicon: name prefix not working #14473

Closed abnerwang0991 closed 2 years ago

abnerwang0991 commented 2 years ago

What happened?

Material icons doesn't display when I added prefix , o_, to name of Qicon

What did you expect to happen?

Displaying outlined icon

Reproduction URL

https://stackblitz.com/edit/quasarframework-dzwppm?file=src%2Fpages%2FIndexPage.vue

How to reproduce?

Add prefix , o_, to name of Qicon

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Components (quasar)

Platforms/Browsers

Chrome

Quasar info output

No response

Relevant log output

No response

Additional context

No response

pdanpdan commented 2 years ago

https://quasar.dev/vue-components/icon#webfont-icons

abnerwang0991 commented 2 years ago

https://quasar.dev/vue-components/icon#webfont-icons

image I used the example, it didn't display icon

MilosPaunovic commented 2 years ago

Have you checked the warning in a yellow card just below the headline, which says:

If you are using webfont-based icons, make sure that you [installed the icon library](https://quasar.dev/options/installing-icon-libraries) that you are using, otherwise it won’t show up!

abnerwang0991 commented 2 years ago

I got it, I supposed extras in quasar config including 'material-icons' would import all styles of material-icons. The icons displayed after adding 'material-icons-outlined' to extras. Thank you.

rstoenescu commented 2 years ago

Including them all would be a waste of bandwidth for the end-users. You need to pick exactly what you are using.