diff --git a/packages/next/src/generators/application/application.spec.ts b/packages/next/src/generators/application/application.spec.ts
index 578150906f..43e2410cd7 100644
--- a/packages/next/src/generators/application/application.spec.ts
+++ b/packages/next/src/generators/application/application.spec.ts
@@ -401,7 +401,7 @@ describe('app', () => {
           {},
           `
           [
-            "plugin:@nx/nx/react-typescript",
+            "plugin:@nx/react-typescript",
             "next",
             "next/core-web-vitals",
           ]
diff --git a/packages/next/src/generators/application/files/app/page.tsx__tmpl__ b/packages/next/src/generators/application/files/app/page.tsx__tmpl__
index de8950f216..fe4ce590e2 100644
--- a/packages/next/src/generators/application/files/app/page.tsx__tmpl__
+++ b/packages/next/src/generators/application/files/app/page.tsx__tmpl__
@@ -1,3 +1,6 @@
+<% if (styledModule && (styledModule === 'styled-jsx' || styledModule === 'styled-components'))  {%>
+'use client';
+<% }%> 
 <% if (styledModule && styledModule !== 'styled-jsx') {
   var wrapper = 'StyledPage';
 %>import styled from '<%= styledModule %>';<% } else {