Problem with fetching icons (clientBundle)

[PetyXbron]

TLDR; I am having problem with clientBundle working out. (I need to prefetch icons and generate CSS classes for them.)

nuxt 3.16.1 @nuxt/icon 1.11.0 doing this because apexcharts icons

I am having a problem with fetching my desired icons in advance. I am gladly using <Icon> elements, but in one case I need 5 icons in "vanilla" HTML. So I am using <span class="iconify i-pack:name"</span> element. The problem is that this way it doesn't go through the @nuxt/icon module so the class i-pack:name doesn't exist.

Temporary fix is pasting these elements before the case:

<Icon style="display: none;" name="heroicons:magnifying-glass-plus-16-solid" />
<Icon style="display: none;" name="heroicons:magnifying-glass-minus-16-solid" />
<Icon style="display: none;" name="heroicons:arrows-pointing-out-16-solid" />
<Icon style="display: none;" name="heroicons:hand-raised-16-solid" />
<Icon style="display: none;" name="heroicons:arrow-path-16-solid" />

I would love to just use clientBundle in my Nuxt config, like this:

icon: {
  serverBundle: 'remote',
  clientBundle: {
    icons: [
      'heroicons:magnifying-glass-plus-16-solid',
      'heroicons:magnifying-glass-minus-16-solid',
      'heroicons:arrows-pointing-out-16-solid',
      'heroicons:hand-raised-16-solid',
      'heroicons:arrow-path-16-solid',
    ],
    scan: false,
  }
},

and the console writes:

ℹ Nuxt Icon client bundle consist of 5 icons with 2.41KB(uncompressed) in size

but it simply doesn't work as the temprorary solution. Maybe I have misunderstood something in the readme file of @nuxt/icons but I cannot simply find it out. Any ideas please?