how to fix this error when build next build

Question

error occur when doing build next build, I have installed the module that was not found, but the error still appears

./node_modules/mdx-bundler/dist/client.js Module not found: Package path ./compat/jsx-runtime.js is not exported from package /vercel/path0/node_modules/preact (see exports field in /vercel/path0/node_modules/preact/package.json)

this my package

{
  "name": "x",
  "version": "1.2.0",
  "private": true,
  "scripts": {
    "develop": "vercel",
    "start": "node ./scripts/next-remote-watch.js ./data",
    "dev": "next dev",
    "build": "next build && node ./scripts/generate-sitemap",
    "serve": "next start",
    "analyze": "cross-env ANALYZE=true next build",
    "lint": "next lint --fix --dir pages --dir components --dir lib --dir layouts --dir scripts",
    "prepare": "husky install"
  },
  "dependencies": {
    "@mailchimp/mailchimp_marketing": "^3.0.65",
    "esbuild": "^0.12.15",
    "github-slugger": "^1.4.0",
    "gray-matter": "^4.0.2",
    "image-size": "1.0.0",
    "isomorphic-unfetch": "^3.1.0",
    "mdx-bundler": "^8.0.1",
    "motion": "^10.4.0",
    "next": "12.0.2",
    "next-themes": "^0.0.14",
    "preact": "^10.6.6",
    "querystring": "^0.2.1",
    "react": "^17.0.2",
    "react-dom": "17.0.2",
    "react-icons": "^4.3.1",
    "reading-time": "1.3.0",
    "rehype-autolink-headings": "^6.0.0",
    "rehype-katex": "^6.0.0",
    "rehype-prism-plus": "^1.1.0",
    "rehype-slug": "^5.0.0",
    "remark-footnotes": "^4.0.0",
    "remark-gfm": "^2.0.0",
    "remark-math": "^5.0.0",
    "sharp": "^0.28.3",
    "swr": "^1.1.2",
    "unist-util-visit": "^4.0.0"
  },
  "devDependencies": {
    "@next/bundle-analyzer": "12.0.2",
    "@svgr/webpack": "^5.5.0",
    "@tailwindcss/aspect-ratio": "^0.4.0",
    "@tailwindcss/forms": "^0.4.0",
    "@tailwindcss/line-clamp": "^0.3.0",
    "@tailwindcss/typography": "^0.5.0",
    "@types/react": "^17.0.14",
    "@types/tailwindcss": "^2.2.0",
    "@typescript-eslint/eslint-plugin": "^4.28.1",
    "@typescript-eslint/parser": "^4.28.1",
    "autoprefixer": "^10.4.0",
    "cross-env": "^7.0.3",
    "dedent": "^0.7.0",
    "eslint": "^7.29.0",
    "eslint-config-next": "12.0.2",
    "eslint-config-prettier": "^8.3.0",
    "eslint-plugin-jsx-a11y": "^6.4.1",
    "eslint-plugin-prettier": "^3.3.1",
    "file-loader": "^6.0.0",
    "globby": "11.0.3",
    "husky": "^6.0.0",
    "inquirer": "^8.1.1",
    "lint-staged": "^11.0.0",
    "next-remote-watch": "^1.0.0",
    "postcss": "^8.4.5",
    "prettier": "2.2.1",
    "socket.io": "^4.1.3",
    "socket.io-client": "^4.1.3",
    "tailwindcss": "^3.0.7",
    "typescript": "^4.3.5",
    "vercel": "^24.0.0"
  },
  "lint-staged": {
    "*.+(js|jsx|ts|tsx)": [
      "eslint --fix"
    ],
    "*.+(js|jsx|ts|tsx|json|css|md|mdx)": [
      "prettier --write"
    ]
  }
}