unplugin / unplugin-icons

šŸ¤¹ Access thousands of icons as components on-demand universally.

Home Page:https://www.npmjs.com/package/unplugin-icons

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Icon Files with dot in name error on import

Codermar opened this issue Ā· comments

I have an in-house large collection of icons all named with dots i.e. calendar.circle.fill.svg I have setup a custom collection but I am not able to import the components generated by the custom collection

        'sy': FileSystemIconLoader(
            './public/icons',
            svg => svg.replace(/^<svg /, '<svg fill="currentColor" '),
          ),
      }, 

In component, I can't use the following import or obviously using the custom resolver

import Other from '~icons/sy/calendar.circle.fill'

Icon sy:calendar not found
    at generateComponent (/usr/local/vue-kit/node_modules/unplugin-icons/dist/chunk-6LRP52NF.js:360:11)
    at processTicksAndRejections (node:internal/process/task_queues:96:5)
    at async Context.load (/usr/local/vue-kit/node_modules/unplugin-icons/dist/chunk-6LRP52NF.js:414:22)
    at async Object.load (/usr/local/vue-kit/node_modules/vite/dist/node/chunks/dep-4a9cff06.js:42823:32)
    at async doTransform (/usr/local/vue-kit/node_modules/vite/dist/node/chunks/dep-4a9cff06.js:57868:24

I could not tell where in the code the full name gets truncated in the customCollection. In the above example name results in "calendar" so it will not resolve to the corresponding file. I understand the challenge of dealing with the name with dots (coincidentally numbers will also fail i.e "my.file.01" or my-file-01") but can I transform the file name and replace dots maybe with dashes? maybe introducing a trasformation option to the custom collections or the ability to pass the raw name?