Component auto import doesn't work with custom icons

I can’t get custom icon auto component import to work with unplugin-icons. I have a folder with svgs and I use the FileSystemIconLoader helper to load the icons. As soon, as I explicitly import the icons with

import Ghost from '~icons/custom-icons/ghost'

it works, but eventhough I added the following to the Components configuration, it doesn’t load the components

    Components({
      dts: true,
      resolvers: [
        IconsResolver({
          customCollections: ['custom-icons'],
        }),
      ],
    }),

Here is a reproduction repo based on vitesse-lite and two fontawesome free icons as example: https://github.com/itpropro/unplugin-icons-repro

[itpropro]

Thanks for you detailed exploration @userquin that helped a lot! Lot’s of stuff, I didn’t find in the documentation, as soon as I integrated this, I will create a little docs PR 📜 The packages were indeed quite old and some basic configuration missing as the repo was created in a few minutes in march 😅

[userquin]

also working importing 1 of the icons on src/pages/index.vue , you can check the syntax changes: