# Access vite import.meta.glob image URL in JS

**URL:** https://discourse.roots.io/t/access-vite-import-meta-glob-image-url-in-js/29448
**Category:** sage
**Tags:** sage11
**Created:** 2025-03-12T23:15:36Z
**Posts:** 4

## Post 1 by @rpsstudios — 2025-03-12T23:15:36Z

This might be more of a Vite question, but I can’t seem to find anything online. At the top of the default app.js file we have

```
import.meta.glob([
  '../images/**',
  '../fonts/**',
]);
```

If I want to get an image URL in javascript I have been using `import audio_3 from '../audio/3.mp3';` but this throws the warning `(!) /app/public/wp-content/themes/skillcheck/resources/audio/3.mp3 is dynamically imported by /app/public/wp-content/themes/skillcheck/resources/js/app.js but also statically imported by /app/public/wp-content/themes/skillcheck/resources/js/app.js, dynamic import will not move module into another chunk.`

Is there a better way to get the image URLs from the /build/assets folder?

---

## Post 2 by @rpsstudios — 2025-03-12T23:21:37Z

Did a little more digging and it seems like I might have found my own solution. Just add `{ eager: true }` to the import.meta.glob call. Then you can access the assets by path as seen below. Please let me know if there is a better way.

```
const assets = import.meta.glob([
  '../audio/**',
  '../videos/**',
  '../images/**',
  '../fonts/**',
], { eager: true });

console.log(assets['../audio/3.mp3'].default);
```

---

## Post 3 by @ben — 2025-03-13T01:08:41Z

Looks like `eager` is the way to go :+1:

I’m thinking we’ll probably want to get Sage updated to use that — at least for images. I’ll also [get the docs updated](https://roots.io/sage/docs/compiling-assets/) with an example.

Thanks for the follow up :pray:

---

## Post 4 by @ben — 2025-03-13T01:15:31Z

PR: [🩹 Enable eager loading for images and fonts by retlehs · Pull Request #3245 · roots/sage · GitHub](https://github.com/roots/sage/pull/3245)
