Importing .png files shows error on build | Nuxt | Page 1

half socket Oct 22, 2023, 2:58 AM

#

I'm importing asset files as so: ts import icon from '@/assets/icon.png'; When I run nuxi dev, I get the following logs: ```

ℹ Vite client warmed up in 7272ms 7:48:23 p.m.

[7:48:24 p.m.] WARN (inject plugin) rollup-plugin-inject: failed to parse /Users/user/Documents/project/src/assets/guildicon.png. Consider restricting the plugin to particular files via options.include

[nitro 7:48:24 p.m.] ERROR RollupError: Unexpected character '�' (Note that you need plugins to import files that are not JavaScript)

1: �PNG
^
2:
IHDR�M��zTXtRaw profile type exifxڵ�i��Hv����x�w��RUݥ.[:Jf�` ��;<��>��&�Rs��...

✔ Nitro built in 2422 ms nitro 7:48:24 p.m.

[7:48:24 p.m.] WARN (inject plugin) rollup-plugin-inject: failed to parse /Users/user/Documents/project/src/assets/icon.png. Consider restricting the plugin to particular files via options.include
```Any idea what might be causing this? I'm using nuxi 3.9.0 and nuxt@3.7.4,

steep crane Oct 22, 2023, 8:56 AM

#

Instead of importing, just “use” it in your image tag for example

half socket Oct 22, 2023, 6:36 PM

#

I’m using the imported icon as the src string, as I’d expect from https://vitejs.dev/guide/assets.html

Vite

Next Generation Frontend Tooling

#

Oh, sorry, I only just noticed https://nuxt.com/docs/getting-started/assets#example-1

Nuxt

Assets · Get Started with Nuxt

Nuxt offers two options for your assets.

#

How would I access them dynamically, though? For instance, setting src to either a url fetched from DB or a fallback of @/assets/icon.png

#Importing .png files shows error on build