diff --git a/packages/next/shared/lib/dynamic.tsx b/packages/next/shared/lib/dynamic.tsx index 76ac1f12e4f586a..c46d12302cc0873 100644 --- a/packages/next/shared/lib/dynamic.tsx +++ b/packages/next/shared/lib/dynamic.tsx @@ -34,7 +34,7 @@ export type LoadableBaseOptions
= LoadableGeneratedOptions & {
| React.LazyExoticComponent = LoadableBaseOptions
@@ -115,25 +115,25 @@ export default function dynamic (
if (!process.env.__NEXT_REACT_ROOT) {
if (
process.env.NODE_ENV !== 'production' &&
- loadableOptions.suspense &&
+ loadableOptions.unstable_suspense &&
!isServerSide
) {
console.warn(
`Enable experimental.reactRoot or use React version above 18 to use suspense option`
)
}
- loadableOptions.suspense = false
+ loadableOptions.unstable_suspense = false
}
- const { suspense, loader } = loadableOptions
- // If suspense is enabled, delegate rendering to suspense
- if (suspense) {
+ const { unstable_suspense, loader } = loadableOptions
+ // If unstable_suspense is enabled, delegate rendering to unstable_suspense
+ if (unstable_suspense) {
delete loadableOptions.loadableGenerated
delete loadableOptions.loading
delete loadableOptions.ssr
}
- if (typeof loadableOptions.loader === 'function' && suspense) {
+ if (typeof loadableOptions.loader === 'function' && unstable_suspense) {
loadableOptions.loader = React.lazy(
loader as () => Promise<{
default: React.ComponentType
@@ -150,7 +150,7 @@ export default function dynamic (
}
// support for disabling server side rendering, eg: dynamic(import('../hello-world'), {ssr: false})
- if (loadableOptions.ssr === false && !suspense) {
+ if (loadableOptions.ssr === false && !unstable_suspense) {
return noSSR(loadableFn, loadableOptions)
}
diff --git a/packages/next/shared/lib/loadable.js b/packages/next/shared/lib/loadable.js
index b1382f80b3b6628..103f04dc40c550d 100644
--- a/packages/next/shared/lib/loadable.js
+++ b/packages/next/shared/lib/loadable.js
@@ -66,11 +66,14 @@ function createLoadableComponent(loadFn, options) {
timeout: null,
webpack: null,
modules: null,
- suspense: false,
+ unstable_suspense: false,
},
options
)
+ opts.suspense = opts.unstable_suspense
+ delete opts.unstable_suspense
+
let subscription = null
function init() {
if (opts.suspense) {