Why svgr loads a string instead of the actual svg?

Question

I have added svgr to my webpack config. When importing a svg in a component, I have a string: a8ef8eeaa76ec666d9b8ee7e93eea4c4.svg instead of the actual svg. How to fix this?

module: {
      rules: [
        {
          test: /\.(ts|js)x?$/,
          exclude: /node_modules/,
          use: { loader: "babel-loader" },
        },
        { test: /\.css$/, use: ["style-loader", "css-loader"] },
        { test: /\.(png|jpg|gif)$/, use: ["file-loader"] },
        {
          test: /\.svg$/,
          use: ["@svgr/webpack"],
        },
      ],
    },

import React from "react";
import Upload from "../../assets/svg/upload.svg";

export default function Icon() {
  return <div>{Upload}</div>;
}