wip2

packages/next-swc/crates/next-core/src/next_server/context.rs

@@ -50,9 +50,9 @@ use crate::{
     next_server::resolve::ExternalPredicate,
     next_shared::{
         resolve::{
-            get_invalid_client_only_resolve_plugin, ModuleFeatureReportResolvePlugin,
-            NextExternalResolvePlugin, NextNodeSharedRuntimeResolvePlugin,
-            UnsupportedModulesResolvePlugin,
+            get_invalid_client_only_resolve_plugin, get_invalid_styled_jsx_resolve_plugin,
+            ModuleFeatureReportResolvePlugin, NextExternalResolvePlugin,
+            NextNodeSharedRuntimeResolvePlugin, UnsupportedModulesResolvePlugin,
         },
         transforms::{
             emotion::get_emotion_transform_rule, get_ecma_transform_rule,
@@ -114,6 +114,8 @@ pub async fn get_server_resolve_options_context(
     let module_feature_report_resolve_plugin = ModuleFeatureReportResolvePlugin::new(project_path);
     let unsupported_modules_resolve_plugin = UnsupportedModulesResolvePlugin::new(project_path);
     let invalid_client_only_resolve_plugin = get_invalid_client_only_resolve_plugin(project_path);
+    let invalid_styled_jsx_client_only_resolve_plugin =
+        get_invalid_styled_jsx_resolve_plugin(project_path);
 
     // Always load these predefined packages as external.
     let mut external_packages: Vec<String> = load_next_js_templateon(
@@ -221,10 +223,13 @@ pub async fn get_server_resolve_options_context(
         | ServerContextType::AppRoute { .. }
         | ServerContextType::Instrumentation => {
             plugins.push(Vc::upcast(invalid_client_only_resolve_plugin));
+            plugins.push(Vc::upcast(invalid_styled_jsx_client_only_resolve_plugin));
         }
         ServerContextType::AppSSR { .. } => {
             //[TODO] Build error in this context makes rsc-build-error.ts fail which expects runtime error code
             // looks like webpack and turbopack have different order, webpack runs rsc transform first, turbopack triggers resolve plugin first.
+            //plugins.push(Vc::upcast(invalid_client_only_resolve_plugin));
+            //plugins.push(Vc::upcast(invalid_styled_jsx_client_only_resolve_plugin));
         }
         ServerContextType::Middleware => {
             //noop
@@ -548,7 +553,7 @@ pub async fn get_server_module_options_context(
             ..
         } => {
             let mut custom_source_transform_rules: Vec<ModuleRule> =
-                vec![styled_components_transform_rule]
+                vec![styled_components_transform_rule, styled_jsx_transform_rule]
                     .into_iter()
                     .flatten()
                     .collect();

packages/next-swc/crates/next-core/src/next_shared/resolve.rs

@@ -235,7 +235,6 @@ pub(crate) fn get_invalid_client_only_resolve_plugin(
 /// Returns a resolve plugin if context have imports to `server-only`.
 /// Only the contexts that alises `server-only` to
 /// `next/dist/compiled/server-only/index` should use this.
-#[allow(unused)]
 pub(crate) fn get_invalid_server_only_resolve_plugin(
     root: Vc<FileSystemPath>,
 ) -> Vc<InvalidImportResolvePlugin> {
@@ -250,6 +249,25 @@ pub(crate) fn get_invalid_server_only_resolve_plugin(
     )
 }
 
+/// Returns a resolve plugin if context have imports to `styled-jsx`.
+pub(crate) fn get_invalid_styled_jsx_resolve_plugin(
+    root: Vc<FileSystemPath>,
+) -> Vc<InvalidImportResolvePlugin> {
+    InvalidImportResolvePlugin::new(
+        root,
+        "styled-jsx".to_string(),
+        vec![
+            "'client-only' cannot be imported from a Server Component module. It should only be \
+             used from a Client Component."
+                .to_string(),
+            "The error was caused by using 'styled-jsx'. It only works in a Client Component but \
+             none of its parents are marked with \"use client\", so they're Server Components by \
+             default."
+                .to_string(),
+        ],
+    )
+}
+
 #[turbo_tasks::value]
 pub(crate) struct NextExternalResolvePlugin {
     root: Vc<FileSystemPath>,

packages/next-swc/crates/next-core/src/next_shared/transforms/styled_jsx.rs

@@ -9,7 +9,7 @@ use turbopack_binding::turbopack::{
 use super::get_ecma_transform_rule;
 use crate::next_config::NextConfig;
 
-/// Returns a transform rule for the relay graphql transform.
+/// Returns a transform rule for the styled jsx transform.
 pub async fn get_styled_jsx_transform_rule(
     next_config: Vc<NextConfig>,
     target_browsers: Vc<RuntimeVersions>,