diff --git a/packages/next/shared/lib/dynamic.tsx b/packages/next/shared/lib/dynamic.tsx
index 9df1344abf22..bf5bb6ee6245 100644
--- a/packages/next/shared/lib/dynamic.tsx
+++ b/packages/next/shared/lib/dynamic.tsx
@@ -114,7 +114,9 @@ export default function dynamic
(
// Support for passing options, eg: dynamic(import('../hello-world'), {loading: () =>
Loading something
})
loadableOptions = { ...loadableOptions, ...options }
- const suspenseOptions = loadableOptions as LoadableSuspenseOptions
+ const suspenseOptions = loadableOptions as LoadableSuspenseOptions & {
+ loader: Loader
+ }
if (!process.env.__NEXT_CONCURRENT_FEATURES) {
// Error if react root is not enabled and `suspense` option is set to true
if (!process.env.__NEXT_REACT_ROOT && suspenseOptions.suspense) {
diff --git a/test/integration/react-18/app/components/ts-foo.tsx b/test/integration/react-18/app/components/ts-foo.tsx
new file mode 100644
index 000000000000..f29172cb4aa5
--- /dev/null
+++ b/test/integration/react-18/app/components/ts-foo.tsx
@@ -0,0 +1,3 @@
+export default function TsFoo() {
+ return
ts-foo
+}
diff --git a/test/integration/react-18/app/pages/suspense/typing.tsx b/test/integration/react-18/app/pages/suspense/typing.tsx
new file mode 100644
index 000000000000..5b5df73d7366
--- /dev/null
+++ b/test/integration/react-18/app/pages/suspense/typing.tsx
@@ -0,0 +1,14 @@
+import React, { Suspense } from 'react'
+import dynamic from 'next/dynamic'
+
+const DynamicFoo = dynamic(() => import('../../components/ts-foo'), {
+ suspense: true,
+})
+
+export default function Typing() {
+ return (
+
+
+
+ )
+}
diff --git a/test/integration/react-18/app/tsconfig.json b/test/integration/react-18/app/tsconfig.json
new file mode 100644
index 000000000000..93a83a407c40
--- /dev/null
+++ b/test/integration/react-18/app/tsconfig.json
@@ -0,0 +1,19 @@
+{
+ "compilerOptions": {
+ "target": "es5",
+ "lib": ["dom", "dom.iterable", "esnext"],
+ "allowJs": true,
+ "skipLibCheck": true,
+ "strict": false,
+ "forceConsistentCasingInFileNames": true,
+ "noEmit": true,
+ "esModuleInterop": true,
+ "module": "esnext",
+ "moduleResolution": "node",
+ "resolveJsonModule": true,
+ "isolatedModules": true,
+ "jsx": "preserve"
+ },
+ "include": ["next-env.d.ts", "**/*.ts", "**/*.tsx"],
+ "exclude": ["node_modules"]
+}