Turbopack: use a source content regexp for the react compiler (#82631)

### What?

Depending on compilation mode of the react compiler, check the source code if matches a certain regex

This also adds `content` as condition for webpack loaders

Closes PACK-5252

Author: sokra

crates/next-core/src/next_config.rs

@@ -577,24 +577,32 @@ impl TryInto<ConditionPath> for ConfigConditionPath {
     fn try_into(self) -> Result<ConditionPath> {
         Ok(match self {
             ConfigConditionPath::Glob(path) => ConditionPath::Glob(path),
-            ConfigConditionPath::Regex(path) => {
-                ConditionPath::Regex(EsRegex::new(&path.source, &path.flags)?.resolved_cell())
-            }
+            ConfigConditionPath::Regex(path) => ConditionPath::Regex(path.try_into()?),
         })
     }
 
     type Error = anyhow::Error;
 }
 
+impl TryInto<ResolvedVc<EsRegex>> for RegexComponents {
+    fn try_into(self) -> Result<ResolvedVc<EsRegex>> {
+        Ok(EsRegex::new(&self.source, &self.flags)?.resolved_cell())
+    }
+
+    type Error = anyhow::Error;
+}
+
 #[derive(Serialize, Deserialize, Clone, Debug, PartialEq)]
 pub struct ConfigConditionItem {
-    pub path: ConfigConditionPath,
+    pub path: Option<ConfigConditionPath>,
+    pub content: Option<RegexComponents>,
 }
 
 impl TryInto<ConditionItem> for ConfigConditionItem {
     fn try_into(self) -> Result<ConditionItem> {
         Ok(ConditionItem {
-            path: self.path.try_into()?,
+            path: self.path.map(|p| p.try_into()).transpose()?,
+            content: self.content.map(|r| r.try_into()).transpose()?,
         })
     }
 

packages/next/src/build/swc/index.ts

@@ -10,6 +10,7 @@ import { patchIncorrectLockfile } from '../../lib/patch-incorrect-lockfile'
 import { downloadNativeNextSwc, downloadWasmSwc } from '../../lib/download-swc'
 import type {
   NextConfigComplete,
+  ReactCompilerOptions,
   TurbopackLoaderItem,
   TurbopackRuleConfigItem,
   TurbopackRuleConfigItemOptions,
@@ -805,13 +806,15 @@ function bindingToApi(
     originalNextConfig: NextConfigComplete,
     projectPath: string
   ): Record<string, any> {
-    let nextConfig = { ...(originalNextConfig as any) }
+    let nextConfig = { ...(originalNextConfig as NextConfigComplete) }
 
     const reactCompilerOptions = nextConfig.experimental?.reactCompiler
 
     // It is not easy to set the rules inside of rust as resolving, and passing the context identical to the webpack
     // config is bit hard, also we can reuse same codes between webpack config in here.
     if (reactCompilerOptions) {
+      const options: ReactCompilerOptions =
+        typeof reactCompilerOptions === 'object' ? reactCompilerOptions : {}
       const ruleKeys = ['*.ts', '*.js', '*.jsx', '*.tsx']
       if (
         Object.keys(nextConfig?.turbopack?.rules ?? {}).some((key) =>
@@ -826,15 +829,27 @@ function bindingToApi(
         )
       } else {
         nextConfig.turbopack ??= {}
+        nextConfig.turbopack.conditions ??= {}
         nextConfig.turbopack.rules ??= {}
 
         for (const key of ruleKeys) {
-          nextConfig.turbopack.rules[key] = {
+          nextConfig.turbopack.conditions[`#reactCompiler/${key}`] = {
+            path: key,
+            content:
+              options.compilationMode === 'annotation'
+                ? /['"]use memo['"]/
+                : !options.compilationMode ||
+                    options.compilationMode === 'infer'
+                  ? // Matches declaration or useXXX or </ (closing jsx) or /> (self closing jsx)
+                    /['"]use memo['"]|\Wuse[A-Z]|<\/|\/>/
+                  : undefined,
+          }
+          nextConfig.turbopack.rules[`#reactCompiler/${key}`] = {
             browser: {
               foreign: false,
               loaders: [
                 getReactCompilerLoader(
-                  originalNextConfig.experimental.reactCompiler,
+                  reactCompilerOptions,
                   projectPath,
                   nextConfig.dev,
                   /* isServer */ false,
@@ -905,23 +920,36 @@ function bindingToApi(
     if (conditions) {
       type SerializedConditions = {
         [key: string]: {
-          path:
+          path?:
             | { type: 'regex'; value: { source: string; flags: string } }
             | { type: 'glob'; value: string }
+          content?: { source: string; flags: string }
+        }
+      }
+
+      function regexComponents(regex: RegExp): {
+        source: string
+        flags: string
+      } {
+        return {
+          source: regex.source,
+          flags: regex.flags,
         }
       }
 
       const serializedConditions: SerializedConditions = {}
       for (const [key, value] of Object.entries(conditions)) {
         serializedConditions[key] = {
           ...value,
-          path:
-            value.path instanceof RegExp
+          path: !value.path
+            ? undefined
+            : value.path instanceof RegExp
               ? {
                   type: 'regex',
-                  value: { source: value.path.source, flags: value.path.flags },
+                  value: regexComponents(value.path),
                 }
               : { type: 'glob', value: value.path },
+          content: !value.content ? undefined : regexComponents(value.content),
         }
       }
       nextConfigSerializable.turbopack.conditions = serializedConditions

packages/next/src/server/config-schema.ts

@@ -129,7 +129,8 @@ const zTurboRuleConfigItemOrShortcut: zod.ZodType<TurbopackRuleConfigItemOrShort
   z.union([z.array(zTurboLoaderItem), zTurboRuleConfigItem])
 
 const zTurboCondition: zod.ZodType<TurbopackRuleCondition> = z.object({
-  path: z.union([z.string(), z.instanceof(RegExp)]),
+  path: z.union([z.string(), z.instanceof(RegExp)]).optional(),
+  content: z.instanceof(RegExp).optional(),
 })
 
 const zTurbopackConfig: zod.ZodType<TurbopackOptions> = z.strictObject({

packages/next/src/server/config-shared.ts

@@ -262,7 +262,8 @@ export type TurbopackLoaderItem =
     }
 
 export type TurbopackRuleCondition = {
-  path: string | RegExp
+  path?: string | RegExp
+  content?: RegExp
 }
 
 export type TurbopackRuleConfigItemOrShortcut =

turbopack/crates/turbopack/src/module_options/mod.rs

@@ -489,43 +489,58 @@ impl ModuleOptions {
                 )
             };
             for (key, rule) in webpack_loaders_options.rules.await?.iter() {
-                rules.push(ModuleRule::new(
-                    RuleCondition::All(vec![
-                        if key.starts_with("#") {
-                            // This is a custom marker requiring a corresponding condition entry
-                            let conditions = (*webpack_loaders_options.conditions.await?)
-                                .context(
-                                    "Expected a condition entry for the webpack loader rule \
-                                     matching {key}. Create a `conditions` mapping in your \
-                                     next.config.js",
-                                )?
-                                .await?;
-
-                            let condition = conditions.get(key).context(
-                                "Expected a condition entry for the webpack loader rule matching \
-                                 {key}.",
-                            )?;
-
-                            match &condition.path {
-                                ConditionPath::Glob(glob) => RuleCondition::ResourcePathGlob {
+                let mut rule_conditions = Vec::new();
+                if key.starts_with("#") {
+                    // This is a custom marker requiring a corresponding condition entry
+                    let conditions = (*webpack_loaders_options.conditions.await?)
+                        .context(
+                            "Expected a condition entry for the webpack loader rule matching \
+                             {key}. Create a `conditions` mapping in your next.config.js",
+                        )?
+                        .await?;
+
+                    let condition = conditions.get(key).context(
+                        "Expected a condition entry for the webpack loader rule matching {key}.",
+                    )?;
+
+                    let ConditionItem { path, content } = &condition;
+
+                    match &path {
+                        Some(ConditionPath::Glob(glob)) => {
+                            if glob.contains('/') {
+                                rule_conditions.push(RuleCondition::ResourcePathGlob {
                                     base: execution_context.project_path().owned().await?,
                                     glob: Glob::new(glob.clone()).await?,
-                                },
-                                ConditionPath::Regex(regex) => {
-                                    RuleCondition::ResourcePathEsRegex(regex.await?)
-                                }
-                            }
-                        } else if key.contains('/') {
-                            RuleCondition::ResourcePathGlob {
-                                base: execution_context.project_path().owned().await?,
-                                glob: Glob::new(key.clone()).await?,
+                                });
+                            } else {
+                                rule_conditions.push(RuleCondition::ResourceBasePathGlob(
+                                    Glob::new(glob.clone()).await?,
+                                ));
                             }
-                        } else {
-                            RuleCondition::ResourceBasePathGlob(Glob::new(key.clone()).await?)
-                        },
-                        RuleCondition::not(RuleCondition::ResourceIsVirtualSource),
-                        module_css_external_transform_conditions.clone(),
-                    ]),
+                        }
+                        Some(ConditionPath::Regex(regex)) => {
+                            rule_conditions.push(RuleCondition::ResourcePathEsRegex(regex.await?));
+                        }
+                        None => {}
+                    }
+                    if let Some(content) = content {
+                        rule_conditions.push(RuleCondition::ResourceContentEsRegex(content.await?));
+                    }
+                } else if key.contains('/') {
+                    rule_conditions.push(RuleCondition::ResourcePathGlob {
+                        base: execution_context.project_path().owned().await?,
+                        glob: Glob::new(key.clone()).await?,
+                    });
+                } else {
+                    rule_conditions.push(RuleCondition::ResourceBasePathGlob(
+                        Glob::new(key.clone()).await?,
+                    ));
+                };
+                rule_conditions.push(RuleCondition::not(RuleCondition::ResourceIsVirtualSource));
+                rule_conditions.push(module_css_external_transform_conditions.clone());
+
+                rules.push(ModuleRule::new(
+                    RuleCondition::All(rule_conditions),
                     vec![ModuleRuleEffect::SourceTransforms(ResolvedVc::cell(vec![
                         ResolvedVc::upcast(
                             WebpackLoaders::new(

turbopack/crates/turbopack/src/module_options/module_options_context.rs

@@ -50,7 +50,8 @@ pub enum ConditionPath {
 #[turbo_tasks::value(shared)]
 #[derive(Clone, Debug)]
 pub struct ConditionItem {
-    pub path: ConditionPath,
+    pub path: Option<ConditionPath>,
+    pub content: Option<ResolvedVc<EsRegex>>,
 }
 
 #[turbo_tasks::value(shared)]

turbopack/crates/turbopack/src/module_options/rule_condition.rs

@@ -3,9 +3,9 @@ use serde::{Deserialize, Serialize};
 use smallvec::SmallVec;
 use turbo_esregex::EsRegex;
 use turbo_tasks::{NonLocalValue, ReadRef, ResolvedVc, primitives::Regex, trace::TraceRawVcs};
-use turbo_tasks_fs::{FileSystemPath, glob::Glob};
+use turbo_tasks_fs::{FileContent, FileSystemPath, glob::Glob};
 use turbopack_core::{
-    reference_type::ReferenceType, source::Source, virtual_source::VirtualSource,
+    asset::Asset, reference_type::ReferenceType, source::Source, virtual_source::VirtualSource,
 };
 
 #[derive(Debug, Clone, Serialize, Deserialize, TraceRawVcs, PartialEq, Eq, NonLocalValue)]
@@ -24,6 +24,7 @@ pub enum RuleCondition {
     ContentTypeEmpty,
     ResourcePathRegex(#[turbo_tasks(trace_ignore)] Regex),
     ResourcePathEsRegex(#[turbo_tasks(trace_ignore)] ReadRef<EsRegex>),
+    ResourceContentEsRegex(#[turbo_tasks(trace_ignore)] ReadRef<EsRegex>),
     /// For paths that are within the same filesystem as the `base`, it need to
     /// match the relative path from base to resource. This includes `./` or
     /// `../` prefix. For paths in a different filesystem, it need to match
@@ -166,6 +167,15 @@ impl RuleCondition {
                     RuleCondition::ResourcePathEsRegex(regex) => {
                         return Ok(regex.is_match(&path.path));
                     }
+                    RuleCondition::ResourceContentEsRegex(regex) => {
+                        let content = source.content().file_content().await?;
+                        match &*content {
+                            FileContent::Content(file_content) => {
+                                return Ok(regex.is_match(&file_content.content().to_str()?));
+                            }
+                            FileContent::NotFound => return Ok(false),
+                        }
+                    }
                 }
             }
         }