Webpack does not recognize image inserted with jQuery attr

[V-Krause]

I first created an Electron app which worked without any problems and now I want to transfer it to Webpack with the Electron Forge webpack-template. But now I'm facing the problem that everything works so far, but my images, which I added with the jQuery attr command, are not loaded.

Error Message:
Failed to load resource: the server responded with a status of 404 (Not Found)

jQuery inside html file:
$('#slide1').attr("src","./images/example_image.png");

Is there anything I need to consider in connection with jQuery attr and Webpack or where could be the error?

[vankop]

you should use import x from "x" to import resource (image). also you need appropriate webpack config to handle image requests.

[V-Krause]

Okay, I think you mean something like this

      {
        test: /\.(png|svg|jpg|jpeg|gif)$/i,
        type: 'asset/resource',
      },

for the webpack config.

The issue is that I want to change the image using jQuery attr in the html. However, I need to do the import according to this description https://webpack.js.org/guides/asset-management/#loading-images in the index.js, but I need it in the html, right?
Or how do I change the jQuery command so that it recognizes my image?