Could not find the module in the React Client Manifest. This is probably a bug in the React Server Components bundler.

[olros]

Link to the code that reproduces this issue

https://codesandbox.io/p/sandbox/recursing-mountain-yxz8hj?file=/src/components/MediaCard.tsx

To Reproduce

Start the application in v13.5.1 and see how "Unhandled Runtime Error" immediately pops up.

If return <Typography>{text}</Typography>; in MediaCard.tsx in the codesandbox-reproduction is replaced by return <p>{text}</p>;, the error goes away.

Also, if the usage of Box in page.tsx is removed, the error also goes away.

Current vs. Expected behavior

Currently with v13.5.1, when using named imports in both a parent and child file, "Unhandled Runtime Error" is shown. If using named imports in only one of the files, everything works as expected.

Expected to be able to use named imports everywhere as in v13.4.19.

Verify canary release

• I verified that the issue exists in the latest Next.js canary release

Provide environment information

Operating System:
  Platform: linux
  Arch: x64
  Version: #1 SMP PREEMPT_DYNAMIC Sun Aug  6 20:05:33 UTC 2023
Binaries:
  Node: 16.17.0
  npm: 8.15.0
  Yarn: 1.22.19
  pnpm: 7.1.0
Relevant Packages:
  next: 13.5.1
  eslint-config-next: 13.4.19
  react: 18.2.0
  react-dom: 18.2.0
  typescript: 5.1.6
Next.js Config:
  output: N/A

Which area(s) are affected? (Select all that apply)

Not sure, App Router

Additional context

I've only tested named imports from @mui/material

[ElectricCodeGuy]

Getting the same bug with almost all my @mui/material imports. Next13.4 also had this but was much more rare to happen. New updates is on every render with ALL imports

[schimi-dev]

Related to/same as #55566

[dungnk-admixion]

I just encountered this error as I upgraded to v13.5.1 today. Downgrading to v13.4.19 and everything works again.

[thomkrupa]

Getting the same for @tremor/react imports.

Does not work:

import { CategoryBar  } from "@tremor/react";

But this works:

import CategoryBar from "@tremor/react/dist/components/vis-elements/CategoryBar/CategoryBar";

[ElectricCodeGuy]

Found a Fix after bashing my head against it for 2 days

Chaning from:
import { Box, Button, Container, Grid, Typography, Card, CardContent, CardMedia, Divider } from '@mui/material';
to
import Box from '@mui/material/Box'; import Container from '@mui/material/Container'; import Grid from '@mui/material/Grid'; import Typography from '@mui/material/Typography'; import Card from '@mui/material/Card'; import CardContent from '@mui/material/CardContent'; import CardMedia from '@mui/material/CardMedia'; import Divider from '@mui/material/Divider'; import Button from '@mui/material/Button';
It is not every component you have to do it. For what i have tested it is only some of the MUI components(not sure witch) and if you import children into parents both both components must be changed. Server Components must also change.

this fixed, for me atleast all bugs and warnings and render errors related to:
⨯ Internal error: Error: Could not find the module "/home/xxxxxx/xxxxxxx/xxxxxxxx/node_modules/@mui/material/node/Link/index.js#" in the React Client Manifest. This is probably a bug in the React Server Components bundler.
and
__barrel_optimize__?names

Slugs, Parallel route and possible also all other Next Routing that uses MUI must also be changed to get rid of the bug/warning

[github-actions]

This closed issue has been automatically locked because it had no new activity for 2 weeks. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.