Search code examples
sveltekit

Glob import of image urls in SvelteKit

I am trying to import all urls for images in a directory in a wildcard fashion, with two possible extensions:

import urls from "../static/images/**/*.{png,svg}";

Currently there are three files in this directory, importing them individually works fine. When I use this syntax, the files are not found:

Failed to resolve import "../static/images/**/*.{png,svg}" from "src/routes/index.svelte". Does the file exist?

I had heard that it was possible to do this out of the box in SvelteKit, do I need to enable or define the pattern of import in jsconfig.json file in order to achieve this functionality, or install a dependency?

Solution

  • Fixed by changing import to use meta.glob:

    const urls = import.meta.glob("../static/images/**/*.{png,svg}");