Add gSP and gSSP checks for both server and client layers in the SWC transform

packages/next-swc/crates/core/src/react_server_components.rs

@@ -58,7 +58,7 @@ impl<C: Comments> VisitMut for ReactServerComponents<C> {
 
         if self.is_server {
             if !is_client_entry {
-                self.assert_server_graph(&imports);
+                self.assert_server_graph(&imports, module);
             } else {
                 self.to_module_ref(module);
                 return;
@@ -246,7 +246,7 @@ impl<C: Comments> ReactServerComponents<C> {
         );
     }
 
-    fn assert_server_graph(&self, imports: &Vec<ModuleImports>) {
+    fn assert_server_graph(&self, imports: &Vec<ModuleImports>, module: &Module) {
         for import in imports {
             let source = import.source.0.clone();
             if self.invalid_server_imports.contains(&source) {
@@ -288,6 +288,8 @@ impl<C: Comments> ReactServerComponents<C> {
                 }
             }
         }
+
+        self.assert_invalid_api(module);
     }
 
     fn assert_client_graph(&self, imports: &Vec<ModuleImports>, module: &Module) {
@@ -305,10 +307,15 @@ impl<C: Comments> ReactServerComponents<C> {
             }
         }
 
+        self.assert_invalid_api(module);
+    }
+
+    fn assert_invalid_api(&self, module: &Module) {
         // Assert `getServerSideProps` and `getStaticProps` exports.
         let is_layout_or_page = Regex::new(r"/(page|layout)\.(ts|js)x?$")
             .unwrap()
             .is_match(&self.filepath);
+
         if is_layout_or_page {
             let mut span = DUMMY_SP;
             let mut has_get_server_side_props = false;
@@ -389,7 +396,7 @@ impl<C: Comments> ReactServerComponents<C> {
                         .struct_span_err(
                             span,
                             format!(
-                                "`{}` is not allowed in Client Components.",
+                                "NEXT_RSC_ERR_INVALID_API: {}",
                                 if has_get_server_side_props {
                                     "getServerSideProps"
                                 } else {

packages/next-swc/crates/core/tests/errors.rs

@@ -82,7 +82,7 @@ fn react_server_components_server_graph_errors(input: PathBuf) {
         syntax(),
         &|tr| {
             server_components(
-                FileName::Real(PathBuf::from("/some-project/src/some-file.js")),
+                FileName::Real(PathBuf::from("/some-project/src/layout.js")),
                 next_swc::react_server_components::Config::WithOptions(
                     next_swc::react_server_components::Options { is_server: true },
                 ),

packages/next-swc/crates/core/tests/errors/react-server-components/client-graph/get-server-side-props/output.stderr

@@ -1,5 +1,5 @@
 
-  x `getServerSideProps` is not allowed in Client Components.
+  x NEXT_RSC_ERR_INVALID_API: getServerSideProps
    ,-[input.js:1:1]
  1 | export function getServerSideProps (){
    :                 ^^^^^^^^^^^^^^^^^^

packages/next-swc/crates/core/tests/errors/react-server-components/client-graph/get-static-props/output.stderr

@@ -1,5 +1,5 @@
 
-  x `getStaticProps` is not allowed in Client Components.
+  x NEXT_RSC_ERR_INVALID_API: getStaticProps
    ,-[input.js:1:1]
  1 | export function getStaticProps (){
    :                 ^^^^^^^^^^^^^^

packages/next-swc/crates/core/tests/errors/react-server-components/server-graph/get-server-side-props/input.js

@@ -0,0 +1,6 @@
+export function getServerSideProps (){
+}
+
+export default function () {
+  return null;
+}

packages/next-swc/crates/core/tests/errors/react-server-components/server-graph/get-server-side-props/output.js

@@ -0,0 +1,4 @@
+export function getServerSideProps() {}
+export default function() {
+    return null;
+}

packages/next-swc/crates/core/tests/errors/react-server-components/server-graph/get-server-side-props/output.stderr

@@ -0,0 +1,6 @@
+
+  x NEXT_RSC_ERR_INVALID_API: getServerSideProps
+   ,-[input.js:1:1]
+ 1 | export function getServerSideProps (){
+   :                 ^^^^^^^^^^^^^^^^^^
+   `----

packages/next-swc/crates/core/tests/errors/react-server-components/server-graph/get-static-props/input.js

@@ -0,0 +1,6 @@
+export function getStaticProps (){
+}
+
+export default function () {
+  return null;
+}

packages/next-swc/crates/core/tests/errors/react-server-components/server-graph/get-static-props/output.js

@@ -0,0 +1,4 @@
+export function getStaticProps() {}
+export default function() {
+    return null;
+}

packages/next-swc/crates/core/tests/errors/react-server-components/server-graph/get-static-props/output.stderr

@@ -0,0 +1,6 @@
+
+  x NEXT_RSC_ERR_INVALID_API: getStaticProps
+   ,-[input.js:1:1]
+ 1 | export function getStaticProps (){
+   :                 ^^^^^^^^^^^^^^
+   `----

packages/next/build/webpack/plugins/wellknown-errors-plugin/parseRSC.ts

@@ -16,6 +16,7 @@ function formatRSCErrorMessage(message: string): null | [string, string] {
     const NEXT_RSC_ERR_CLIENT_DIRECTIVE = /.+NEXT_RSC_ERR_CLIENT_DIRECTIVE\n/s
     const NEXT_RSC_ERR_CLIENT_DIRECTIVE_PAREN =
       /.+NEXT_RSC_ERR_CLIENT_DIRECTIVE_PAREN\n/s
+    const NEXT_RSC_ERR_INVALID_API = /.+NEXT_RSC_ERR_INVALID_API: (.*?)\n/s
 
     if (NEXT_RSC_ERR_REACT_API.test(message)) {
       formattedMessage = message.replace(
@@ -62,6 +63,12 @@ function formatRSCErrorMessage(message: string): null | [string, string] {
         `\n\n"use client" must be a directive, and placed before other expressions. Remove the parentheses and move it to the top of the file to resolve this issue.\n\n`
       )
       formattedVerboseMessage = '\n\nImport path:\n'
+    } else if (NEXT_RSC_ERR_INVALID_API.test(message)) {
+      formattedMessage = message.replace(
+        NEXT_RSC_ERR_INVALID_API,
+        `\n\n"$1" is not supported in app/. Read more: https://beta.nextjs.org/docs/data-fetching/fundamentals\n\n`
+      )
+      formattedVerboseMessage = '\n\nFile path:\n'
     }
 
     return [formattedMessage, formattedVerboseMessage]

packages/next/server/app-render.tsx

@@ -1127,20 +1127,6 @@ export async function renderToHTMLOrFlight(
         }
       }
 
-      // TODO-APP: move these errors to the loader instead?
-      // we will also need a migration doc here to link to
-      if (typeof layoutOrPageMod?.getServerSideProps === 'function') {
-        throw new Error(
-          `getServerSideProps is not supported in app/, detected in ${segment}`
-        )
-      }
-
-      if (typeof layoutOrPageMod?.getStaticProps === 'function') {
-        throw new Error(
-          `getStaticProps is not supported in app/, detected in ${segment}`
-        )
-      }
-
       /**
        * The React Component to render.
        */

test/e2e/app-dir/rsc-errors.test.ts

@@ -52,7 +52,7 @@ describe('app dir - rsc errors', () => {
 
     expect(res.status).toBe(500)
     expect(await res.text()).toContain(
-      '`getServerSideProps` is not allowed in Client Components'
+      '"getServerSideProps\\" is not supported in app/'
     )
   })
 
@@ -79,7 +79,7 @@ describe('app dir - rsc errors', () => {
 
     expect(res.status).toBe(500)
     expect(await res.text()).toContain(
-      '`getStaticProps` is not allowed in Client Components'
+      '"getStaticProps\\" is not supported in app/'
     )
   })