I am trying to display images on the screen but the only thing i get is this

I followed several different guides but they all lead me back to this broken image or no image at all. I have tried svg, jpg and png format but none of them show currectly. I got my images from flaticon and i saved them as pngs and jpgs. They didn't work, i made my own jpg, that didn't work. I then tried svg but they show me this message

Here is the code i have in webpack for module loading

module: {
    rules: [
        {
            test: /\.scss$/,
            use: ['style-loader','css-loader','sass-loader'],
        },
        {
            test: /\.(png|svg|jpg|jpeg|gif)$/i,
            type: 'asset/resource',
        },
    ]
},

here is the code i have for importing the image in js

//import menuburger from './images/test.jpg'
const menuburger = require("./images/menu-burger.svg");
//import add from './images/add.svg'
//import menuleft from './images/angle-left.svg'


const main = async () => {

const mb = document.getElementById('MenuBurgerIMG')

mb.src = menuburger;

html source

<div class = "Menem" id = "MenuBurger">
     <img id  = "MenuBurgerIMG" alt = "" style ="width: 100%;height:100%;">
</div>