fix(nextjs): styled-jsx and styled-components should have "use client…

…"; directive
nrwl · Apr 20, 2023 · b6e47ad · b6e47ad
1 parent 739b4c2
commit b6e47ad
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 1 deletion.
diff --git 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__
@@ -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 {
-Original file line number
+Diff line change
@@ Expand Up / @@ -401,7 +401,7 @@ describe('app', () => { @@
               {},
               `
               [
-                "plugin:@nx/nx/react-typescript",
+                "plugin:@nx/react-typescript",
                 "next",
                 "next/core-web-vitals",
               ]
@@ Expand Down @@