Unable to import icons from library @tabler/icons

[ghost]

Describe the bug

Greetings
I would like to ask you if this is a bug or if something must be configured to enable the proper importing.

In a module/ESM project, when trying to import an icon from library "@tabler/icons", one person can try to import either a .svg file directly, or its equivalent javascript file, which is a const that exports the icon.

I have tried to import an icon in both ways. I also tried to import from index of icons.
I don't even tried yet to make use of the icon, I just try to import firstly.

Whenever I try to build the project using Vite, I see an error in console. It seems that the package is being imported as if it was commonjs. Or maybe it is something related to the name, which contains a @ character.

The same error is observed when trying to import .png files from "@tabler/icons-png" library. I suspected it may be an error in how their package.json is defined. However, it is worth noting that they do offer commonjs and modules definitions in their package.json.

I would appreciate if you could review this issue, and I appreciate if possible, a solution is available for https://github.com/tabler/tabler-icons or here.

PS - maybe it is related: https://stackoverflow.com/questions/71203455/rollup-failed-to-resolve-alias-in-vite

Reproduction

https://stackblitz.com/edit/vitejs-vite-uws8wh?file=package.json

Steps to reproduce

No response

System Info

/* stackblitz */
System:
    OS: Linux 5.0 undefined
    CPU: (8) x64 Intel(R) Core(TM) i9-9880H CPU @ 2.30GHz
    Memory: 0 Bytes / 0 Bytes
    Shell: 1.0 - /bin/jsh
  Binaries:
    Node: 18.18.0 - /usr/local/bin/node
    Yarn: 1.22.19 - /usr/local/bin/yarn
    npm: 9.4.2 - /usr/local/bin/npm
    pnpm: 8.14.0 - /usr/local/bin/pnpm
  npmPackages:
    vite: ^5.0.11 => 5.0.11 

/* local */
System:
    OS: Linux 6.5 Ubuntu 23.10 23.10 (Mantic Minotaur)
    CPU: (16) x64 12th Gen Intel(R) Core(TM) i7-12650H
    Memory: 3.42 GB / 3.83 GB
    Container: Yes
    Shell: 5.2.15 - /bin/bash
  Binaries:
    Node: 21.5.0 - ~/.nvm/versions/node/v21.5.0/bin/node
    npm: 10.2.4 - ~/.nvm/versions/node/v21.5.0/bin/npm

Used Package Manager

npm

Logs

/* stackblitz */
[vite]: Rollup failed to resolve import "@tabler/icons-png/icons/2fa.png" from "/home/projects/vitejs-vite-uws8wh/main.js".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
build.rollupOptions.external
error during build:
Error: [vite]: Rollup failed to resolve import "@tabler/icons-png/icons/2fa.png" from "/home/projects/vitejs-vite-uws8wh/main.js".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
build.rollupOptions.external
at viteWarn (/home/projects/vitejs-vite-uws8wh/node_modules/vite/dist/node/chunks/dep-V3BH7oO1.js:67362:27)
at onRollupWarning (/home/projects/vitejs-vite-uws8wh/node_modules/vite/dist/node/chunks/dep-V3BH7oO1.js:67390:17)
at onwarn (/home/projects/vitejs-vite-uws8wh/node_modules/vite/dist/node/chunks/dep-V3BH7oO1.js:67107:28)
at getDefaultOnLog/< (/home/projects/vitejs-vite-uws8wh/node_modules/rollup/dist/es/shared/node-entry.js:17423:19)
at logger (/home/projects/vitejs-vite-uws8wh/node_modules/rollup/dist/es/shared/node-entry.js:19081:14)
at handleInvalidResolvedId (/home/projects/vitejs-vite-uws8wh/node_modules/rollup/dist/es/shared/node-entry.js:18027:26)
at getResolveStaticDependencyPromises/< (/home/projects/vitejs-vite-uws8wh/node_modules/rollup/dist/es/shared/node-entry.js:17985:26)

/* local */
[vite]: Rollup failed to resolve import "@tabler/icons-png/icons/2fa.png" from "/.../MyFile.js".
This is most likely unintended because it can break your application at runtime.
If you do want to externalize this module explicitly add it to
build.rollupOptions.external

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[stackblitz]

Start a new pull request in StackBlitz Codeflow.

• vitejs-vite-uws8wh (Open reproduction)

[sapphi-red]

There's two things wrong in your reproduction.

1. @tabler/icons-png needs to be installed.
2. Instead of import icon from '@tabler/icons-png/icons/2fa.png', the import should be import icon from '@tabler/icons-png/2fa.png', because exports field declares like that.

Closing as this is not a bug in Vite.