How to include static asset/image with svelte component and webpack?

Question

I want to create a svelte component (based on webpack) which uses/imports a static image. How do I make sure that the image gets properly exported, i.e. that a svelte app using my component also sees the image?

In my component, I tried importing the image and using the file-loader for webpack:

import image from "./image.jpg";

and

{
    test: /\.(png|svg|jpg|gif)$/,
    use: [
        'file-loader',
    ],
}

This works, the image is included in the dist folder, but in this case I also need to add a file-loader to the main svelte app, which is an additional requirement I want to avoid. The main app should only need to import my component.

Is this possible or is the above already the recommended approach?

Answer 1

Seems like this is an open issue of svelte-loader.