Trying to use get images to be loaded by CSS url in Electron

I am having trouble implementing any information I can find about how to get my CSS to work under Electron where it has background-image w/ url classes.

At this point, I have an import statement in my renderer that imports the desired png, but it ends up just being the string of the renamed file deployed i.e. a47d7c47249596e68144.png

Now getting that to be loaded by the CSS is unknown. I saw some articles talk about creating a custom handler on the protocol class, but I can’t figure out how to use it. I did this:

protocol.handle('image', (request) => {
      console.log("!!!!!! request for image "+request.url);
    });

just to test if it ever gets called by the css when I do this:

background-image: url("image://logos/logo.png");

but while no errors occur, I never see my console log so it is never getting called.

What am I missing in this process or what should I do differently?

I just want it working the simplest way possible.

In my webpack config it loads images as so:

module: {
    rules: [
      {
        test: /.css$/,
        use: [
          'style-loader',
          'css-loader'
        ]
      },
      {
        test: /.(jpe?g|svg|png|gif|ico|eot|ttf|woff2?|aac|flac|mp3|ogg|wav)(?v=d+.d+.d+)?$/i,
        type: 'asset/resource',
      },
    ],
  }