vue.jsquasar-frameworkquasar

Quasar q-icon to use icon in assets folder

I have an icon named "home.svg" in my assets folder. how can I direct my q-icon component to get the icon inside the assets/ directory.

I have tried applying this way:

  <q-icon name="img:/assets/home.svg" class="text-dark" style="font-size: 32px;" />

but the image is not being rendered.

enter image description here

Solution

  • You want to use the default slot. And see Asset Resolving Rules.

    <q-icon class="text-dark" size="lg">
  <img src="~assets/home.svg" />
</q-icon>