Error:
When trying to compile the Next.js project, the following error occurs:

TypeError: Cannot read properties of null (reading 'fn')
    at /path/to/file/bundle5.js:13:29685
    ...

Relevant Files:

package.json:

{
  "name": "web-feature-store-v2",
  "version": "0.1.0",
  "private": false,
  "scripts": {
    "dev": "next dev",
    "build": "next build && npx tailwind -i app/globals.css -o app/tailwind.css",
    "start": "next start",
    "lint": "next lint"
  },
  "dependencies": {
    "@chakra-ui/react": "^2.8.0",
    "@emotion/react": "^11.11.1",
    "@emotion/styled": "^11.11.0",
    "@google-cloud/storage": "^7.5.0",
    "@module-federation/enhanced": "^0.1.8",
    "@module-federation/nextjs-mf": "^6.1.3",
    "@mui/icons-material": "^5.14.1",
    "@mui/material": "^5.14.2",
    "@mui/x-data-grid": "^6.10.2",
    "@radix-ui/colors": "^3.0.0-rc.4",
    "@radix-ui/primitive": "^1.0.1",
    "@radix-ui/react-checkbox": "^1.0.4",
    "@radix-ui/react-dropdown-menu": "^2.0.5",
    "@react-oauth/google": "^0.11.1",
    "@reduxjs/toolkit": "^1.9.5",
    "@tanstack/react-query": "^4.33.0",
    "@tanstack/react-table": "^8.9.7",
    "@types/chart.js": "^2.9.40",
    "@types/node": "20.4.5",
    "@types/react": "18.2.17",
    "@types/react-dom": "18.2.7",
    "axios": "^1.4.0",
    "bootstrap": "^5.3.1",
    "chart.js": "^4.4.0",
    "class-variance-authority": "^0.7.0",
    "clsx": "^2.0.0",
    "dotenv": "^16.3.1",
    "encoding": "^0.1.13",
    "env-cmd": "^10.1.0",
    "eslint": "8.46.0",
    "eslint-config-next": "13.4.12",
    "framer-motion": "^10.16.2",
    "fs": "^0.0.1-security",
    "lib-utils-ts": "^2.0.4-stable",
    "lucide-react": "^0.274.0",
    "net": "^1.0.2",
    "next": "13.4.12",
    "next-auth": "^4.22.3",
    "react": "18.2.0",
    "react-bootstrap": "^2.8.0",
    "react-chartjs-2": "^5.2.0",
    "react-dom": "18.2.0",
    "react-modal": "^3.16.1",
    "react-redux": "^8.1.2",
    "reactjs-popup": "^2.0.6",
    "reactstrap": "^9.2.0",
    "sharp": "^0.32.4",
    "tailwind-merge": "^1.14.0",
    "tailwindcss-animate": "^1.0.7",
    "typescript": "5.1.6"
  },
  "devDependencies": {
    "@faker-js/faker": "^8.0.2",
    "@types/react-modal": "^3.16.0",
    "autoprefixer": "^10.4.14",
    "json-loader": "^0.5.7",
    "postcss": "^8.4.27",
    "react-router-dom": "^6.14.2",
    "tailwindcss": "^3.3.3"
  },
  "browser": {
    "child_process": false,
    "fs": false,
    "tls": false
  },
  "resolutions": {
    "webpack": "5.1.3"
  }
}

index.tsx

import dynamic from "next/dynamic"
import { NextFederationPlugin } from '@module-federation/nextjs-mf';

const ContainerPage = dynamic(() => import ('container/App').then(module => module.default));

export default function Doapprove(){
    return (
        <>
            <div className="flex flex-col">
                <div id="remote-container">
                    <ContainerPage />
                </div>
            </div>
        </>
    )
}

next.config.js

module.exports = {
  plugin: [
    new NextFederationPlugin({
      name: 'WebFS',
      remotes: {
        container: `container@https://xxxx-Xxxx-xxxx-dev.xxxnet.com.br/_next/static/chunks/remoteEntry.js[getRandomString()]`,
      },
      filename: 'static/chunks/remoteEntry.js',
      shared: {
        // whatever else
      },
    })
  ]
}

Description:
When attempting to compile the Next.js project with webpack, a type error occurs during the compilation process. The error mentions “TypeError: Cannot read properties of null (reading ‘fn’)”, indicating that there is an issue during the execution of a function somewhere in the code.

I expected the solution