diff --git a/packages/next/build/webpack-config.ts b/packages/next/build/webpack-config.ts
index 8079c36dec485..cceb0e81c7aed 100644
--- a/packages/next/build/webpack-config.ts
+++ b/packages/next/build/webpack-config.ts
@@ -1035,7 +1035,7 @@ export default async function getBaseWebpackConfig(
                 enforce: true,
                 name: 'rsc-runtime-deps',
                 filename: 'rsc-runtime-deps.js',
-                test: /(node_modules\/react\/|\/shared\/lib\/head-manager-context\.js)/,
+                test: /(node_modules\/react\/|\/shared\/lib\/head-manager-context\.js|node_modules\/styled-jsx\/)/,
               },
             }
           : undefined
@@ -1280,7 +1280,7 @@ export default async function getBaseWebpackConfig(
               // Move shared dependencies from sc_server and sc_client into the
               // same layer.
               {
-                test: /(node_modules\/react\/|\/shared\/lib\/head-manager-context\.js)/,
+                test: /(node_modules\/react\/|\/shared\/lib\/head-manager-context\.js|node_modules\/styled-jsx\/)/,
                 layer: 'rsc_shared_deps',
               },
             ]
diff --git a/test/integration/react-streaming-and-server-components/app/components/styled-jsx.client.js b/test/integration/react-streaming-and-server-components/app/components/styled-jsx.client.js
new file mode 100644
index 0000000000000..6759ea8e21ca5
--- /dev/null
+++ b/test/integration/react-streaming-and-server-components/app/components/styled-jsx.client.js
@@ -0,0 +1,12 @@
+export default function Comp() {
+  return (
+    <div>
+      <h1>Red</h1>
+      <style jsx>{`
+        h1 {
+          color: red;
+        }
+      `}</style>
+    </div>
+  )
+}
diff --git a/test/integration/react-streaming-and-server-components/app/pages/styled-jsx.server.js b/test/integration/react-streaming-and-server-components/app/pages/styled-jsx.server.js
new file mode 100644
index 0000000000000..7a49dab60a0c0
--- /dev/null
+++ b/test/integration/react-streaming-and-server-components/app/pages/styled-jsx.server.js
@@ -0,0 +1,13 @@
+import Comp from '../components/styled-jsx.client'
+
+export default function Page() {
+  return (
+    <div>
+      <Comp />
+    </div>
+  )
+}
+
+export const config = {
+  runtime: 'edge',
+}
diff --git a/test/integration/react-streaming-and-server-components/test/rsc.js b/test/integration/react-streaming-and-server-components/test/rsc.js
index e20010e4578ed..b4a795db84f7d 100644
--- a/test/integration/react-streaming-and-server-components/test/rsc.js
+++ b/test/integration/react-streaming-and-server-components/test/rsc.js
@@ -270,6 +270,13 @@ export default function (context, { runtime, env }) {
     expect(content).toContain('This should be in red')
   })
 
+  it('should SSR styled-jsx correctly', async () => {
+    const html = await renderViaHTTP(context.appPort, '/styled-jsx')
+    const styledJsxClass = getNodeBySelector(html, 'h1').attr('class')
+
+    expect(html).toContain(`h1.${styledJsxClass}{color:red}`)
+  })
+
   it('should handle 404 requests and missing routes correctly', async () => {
     const id = '#text'
     const content = 'custom-404-page'