You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Docs suggest that in order to use dynamic() imports with named exports we should use import('../components/hello').then((mod) => mod.Hello)
By importing a client component from a server component using this pattern for named exports, you get Error: Cannot await or return from a thenable. I'm opening this issue mainly because you get no information whatsoever by searching online yet.
I'd expect either the documentation to explicitly tell that you shouldn't use this pattern on this scenario, or better yet, that docs provided a viable pattern to be used when importing client from server via named exports.
As a quick fix, I just separated every component into its own file and export default each one, thus removing the need for .then
The text was updated successfully, but these errors were encountered:
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.
Link to the code that reproduces this issue
https://github.com/rafzan/thenable-error
To Reproduce
Error: Cannot await or return from a thenable
Current vs. Expected behavior
The application should build, like in prior versions.
Provide environment information
Operating System: Platform: darwin Arch: arm64 Version: Darwin Kernel Version 24.0.0: Tue Sep 24 23:37:25 PDT 2024; root:xnu-11215.1.12~1/RELEASE_ARM64_T6030 Available memory (MB): 18432 Available CPU cores: 11 Binaries: Node: 20.13.1 npm: 10.5.2 Yarn: 1.22.22 pnpm: N/A Relevant Packages: next: 15.0.1 // Latest available version is detected (15.0.1). eslint-config-next: 15.0.1 react: 19.0.0-rc-69d4b800-20241021 react-dom: 19.0.0-rc-69d4b800-20241021 typescript: 5.6.3 Next.js Config: output: N/A
Which stage(s) are affected? (Select all that apply)
next build (local)
Additional context
https://nextjs.org/docs/pages/building-your-application/optimizing/lazy-loading
Docs suggest that in order to use
dynamic()
imports with named exports we should useimport('../components/hello').then((mod) => mod.Hello)
By importing a
client
component from aserver
component using this pattern for named exports, you getError: Cannot await or return from a thenable
. I'm opening this issue mainly because you get no information whatsoever by searching online yet.I'd expect either the documentation to explicitly tell that you shouldn't use this pattern on this scenario, or better yet, that docs provided a viable pattern to be used when importing
client
fromserver
via named exports.As a quick fix, I just separated every component into its own file and
export default
each one, thus removing the need for.then
The text was updated successfully, but these errors were encountered: