NextJS not rendering images after build

I have a NextJS application where i want to render social logo’s dynamical. Now on my dev server this is working fine, but when i execute the build command the images are not visible anymore?

This is my component:

import { socialProviders } from "@/src/auth";
import Image from "next/image";
import { signInWith } from "../app/actions";
import { useCallback } from "react";

const SocialLoginButtons = () => {
  const handleSignIn = useCallback(async (providerName) => {
    await signInWith(providerName.toLowerCase());
  }, []);

  return (
    <div className="w-full flex flex-col border-opacity-50">
      <div className="divider text-sm">Or</div>
      {socialProviders.map((provider) => {
        const providerNameLowerCase = provider.name.toLowerCase();
        const iconSrc = `/images/${providerNameLowerCase}.png`;
        return (
          <button
            key={provider.name}
            onClick={() => handleSignIn(provider.name)}
            className="flex items-center justify-center mt-4 border rounded-lg px-6 py-2 text-sm font-medium focus:outline-none focus:ring-2 focus:ring-offset-2 w-full"
          >
            <Image
              src={iconSrc}
              width={24}
              height={24}
              alt={`${provider.name} icon`}
              priority={true}
              loading="eager"
            />
            <span className="ml-2">Continue with {provider.name}</span>
          </button>
        );
      })}
    </div>
  );
};

export default SocialLoginButtons;

Images are located in the public/images folder.

enter image description here