react_on_rails 17.0.1 → 17.1.0.rc.0

data/lib/generators/react_on_rails/rsc_setup/client_references.rb

@@ -594,14 +594,10 @@ module ReactOnRails
           # those configs manually.
           return true if sections.empty?
 
-          sections.all? do |section|
-            body = section.fetch(:body)
-            if rsc_plugin_body_has_top_level_scoped_client_references?(body)
-              scoped_rsc_client_references_defined?(content)
-            else
-              rsc_plugin_body_has_top_level_key?(body, "clientReferences")
+          generated_rsc_client_references_defined?(content) &&
+            sections.all? do |section|
+              rsc_plugin_body_has_top_level_scoped_client_references?(section.fetch(:body))
             end
-          end
         end
 
         # Counts active `new RSCWebpackPlugin(...)` calls whose first argument is present but
@@ -1229,13 +1225,13 @@ module ReactOnRails
         # the same comment-, string-, and brace-aware semantics as the rewrite path.
         def rsc_plugin_body_has_top_level_scoped_client_references?(body)
           [
-            /\bclientReferences\s*:\s*rscClientReferences\b/,
-            /(['"`])clientReferences\1\s*:\s*rscClientReferences\b/
-          ].any? do |pattern|
+            [/\bclientReferences\b/, false],
+            [/(['"`])clientReferences\1/, true]
+          ].any? do |pattern, quoted|
             search_from = 0
 
             while (match = pattern.match(body, search_from))
-              return true if js_top_level_position?(body, match.begin(0))
+              return true if top_level_scoped_client_references_match?(body, match, quoted:)
 
               search_from = match.end(0)
             end
@@ -1244,6 +1240,20 @@ module ReactOnRails
           false
         end
 
+        def top_level_scoped_client_references_match?(body, match, quoted:)
+          return false unless js_top_level_position?(body, match.begin(0))
+          return false unless rsc_plugin_body_key_position?(body, match.begin(0), match.end(0), quoted:)
+
+          colon_index = first_js_token_index(body, match.end(0))
+          return false unless colon_index && body[colon_index] == ":"
+
+          value_index = first_js_token_index(body, colon_index + 1)
+          identifier = "rscClientReferences"
+          return false unless value_index && body[value_index, identifier.length] == identifier
+
+          !body[value_index + identifier.length]&.match?(/[A-Za-z0-9_$]/)
+        end
+
         def splice_client_references_into_rsc_plugin_body(body, is_server_match)
           return splice_client_references_at_close_brace(body) if body.include?("\n")
           # Other options follow `isServer:` on the same line — append after the last option so
@@ -1516,20 +1526,48 @@ module ReactOnRails
         end
 
         def generated_rsc_client_references_defined?(content)
-          # Detect the generated `const rscClientReferences = (() => { ... })()` form
-          # structurally rather than by substring-matching template internals such as the
-          # `RSC_MANIFEST_CLIENT_REFERENCES_JSON` env-var name or the `rsc-client-references.json`
-          # filename. Those `content.include?` guards would couple detection to implementation
-          # details — renaming either string would silently break detection without a failing
-          # test — while adding no safety: `scoped_object_literal_defined?` already requires a
-          # real, module-scope `fallbackRscClientReferences` object literal with
-          # `directory: resolve(config.source_path)` (the generator-specific signature), and the
-          # `rsc_client_references_defined?` precondition rejects commented-out declarations — its
-          # `^[ \t]*(?:const|let|var)` anchor skips `//`-prefixed lines, and `js_top_level_position?`
-          # rejects declarations buried inside `/* ... */` blocks.
-          return false unless rsc_client_references_defined?(content)
-
-          scoped_object_literal_defined?(content, "fallbackRscClientReferences")
+          # A fallback directory object plus a binding named `rscClientReferences` is not enough:
+          # legacy configs can wire that fallback directly into the plugin and bypass graph-derived
+          # manifest selection. Verify the generated IIFE shape and its essential manifest path in
+          # executable code while allowing formatter-controlled whitespace to vary.
+          iife_body = generated_rsc_client_references_iife_body(content)
+          return false unless iife_body
+
+          scoped_object_literal_defined?(content, "fallbackRscClientReferences") &&
+            js_code_matches?(
+              iife_body,
+              %r{\bdefaultRefsJson\s*=\s*resolve\(\s*['"]ssr-generated/rsc-client-references\.json['"]\s*,?\s*\)}
+            ) &&
+            js_code_matches?(iife_body, /\breadManifestReferences\s*=\s*\(/) &&
+            js_code_matches?(iife_body, /\breturn\s+readManifestReferences\(\s*defaultRefsJson\s*\)/)
+        end
+
+        def generated_rsc_client_references_iife_body(content)
+          declaration = /^[ \t]*(?:const|let|var)\s+rscClientReferences\s*=\s*\(\s*\(\s*\)\s*=>\s*\{/
+          content.to_enum(:scan, declaration).each do
+            match = Regexp.last_match
+            next unless js_top_level_position?(content, match.begin(0))
+
+            open_brace = match.end(0) - 1
+            close_brace = matching_js_closing_brace(content, open_brace)
+            next unless close_brace
+            next unless content[(close_brace + 1)..].match?(/\A\s*\)\s*\(\s*\)\s*;?/)
+
+            return content[(open_brace + 1)...close_brace]
+          end
+
+          nil
+        end
+
+        def js_code_matches?(content, pattern)
+          search_from = 0
+          while (match = pattern.match(content, search_from))
+            return true if js_code_position?(content, match.begin(0))
+
+            search_from = match.end(0)
+          end
+
+          false
         end
 
         def scoped_object_literal_defined?(content, variable_name)

data/lib/generators/react_on_rails/rsc_setup.rb

@@ -183,7 +183,7 @@ module ReactOnRails
             ⚠️  Procfile.dev not found. Skipping RSC bundle watcher addition.
 
             You'll need to add the RSC bundle watcher to your process manager manually:
-              rsc-bundle: RSC_BUNDLE_ONLY=true bin/shakapacker-watch --watch
+              rsc-bundle: RSC_BUNDLE_ONLY=true #{shakapacker_watch_command}
           MSG
           return
         end
@@ -198,7 +198,7 @@ module ReactOnRails
         rsc_watcher_line = <<~PROCFILE
 
           # React on Rails Pro - RSC bundle watcher
-          rsc-bundle: RSC_BUNDLE_ONLY=true bin/shakapacker-watch --watch
+          rsc-bundle: RSC_BUNDLE_ONLY=true #{shakapacker_watch_command}
         PROCFILE
 
         append_to_file("Procfile.dev", rsc_watcher_line)
@@ -354,62 +354,147 @@ module ReactOnRails
         say "✅ Updated webpack configs for RSC", :green
       end
 
+      # Structural matchers shared by the ServerClientOrBoth (SCOB) transforms in
+      # update_server_client_or_both_for_rsc / update_scob_default_bundle_output and
+      # their verifier counterparts in check_rsc_scob_config. Each keys off a real
+      # JS declaration/branch/assignment shape rather than a bare substring, so:
+      #   * a stray mention in a comment or string literal cannot suppress a
+      #     transform (which would leave dangling `rscConfig` references →
+      #     `ReferenceError: rscConfig is not defined` at runtime) or fool the
+      #     verifier into reporting a partial setup as complete; and
+      #   * linter whitespace reflow (e.g. `[ clientConfig, serverConfig ]`) is
+      #     tolerated, matching the rest of this file.
+      # A transform's skip-guard and its verifier check use the *same* constant so
+      # the two can never disagree on what "already applied" means.
+      RSC_WEBPACK_CONFIG_IMPORT =
+        %r{const\s+rscWebpackConfig\s*=\s*require\(\s*'\./rscWebpackConfig'\s*\)}
+      RSC_CONFIG_DECLARATION = /const\s+rscConfig\s*=\s*rscWebpackConfig\(\s*\)/
+      ENVSPECIFIC_RSC_CALL = /envSpecific\(\s*clientConfig\s*,\s*serverConfig\s*,\s*rscConfig\s*\)/
+      # The RSC_BUNDLE_ONLY branch, matched by its `process.env.RSC_BUNDLE_ONLY`
+      # condition together with the `result = rscConfig` assignment in its body —
+      # a bare `RSC_BUNDLE_ONLY` comment mention satisfies neither.
+      RSC_BUNDLE_ONLY_BRANCH = /process\.env\.RSC_BUNDLE_ONLY\s*\)[^}]*?result\s*=\s*rscConfig\s*;?/
+      # The 2-element default result array we rewrite, and the 3-element RSC-aware
+      # array it becomes — both fully whitespace tolerant (inner brackets/commas).
+      DEFAULT_RESULT_ARRAY = /result\s*=\s*\[\s*clientConfig\s*,\s*serverConfig\s*\]\s*;?/
+      RSC_RESULT_ARRAY = /result\s*=\s*\[\s*clientConfig\s*,\s*serverConfig\s*,\s*rscConfig\s*\]/
+      # The RSC-aware default-build log, matched by its `console.log('…')` call
+      # shape so a bare comment mention of the message text can't no-op the rewrite.
+      RSC_BUNDLES_LOG =
+        /console\.log\(\s*'\[React on Rails\] Creating client, server, and RSC bundles\.'\s*\)/
+      # The bare `} else {` default-build branch: the one whose body reaches the
+      # 2-element default result assignment with no intervening `}`. The
+      # RSC_BUNDLE_ONLY branch is spliced immediately before it. `[^}]` cannot span
+      # an earlier else's closing brace, so an unrelated earlier `} else {` (e.g. an
+      # `if (envSpecific) {…} else {…}`) is never matched, and `\} else \{` never
+      # matches `} else if (…) {`. Keyed off the default result assignment, not the
+      # `// default …` comment, so comment reflow/reword/removal can't no-op it.
+      DEFAULT_BUILD_BRANCH_ANCHOR = /\n(\s*\}\s*else\s*\{[^}]*?#{DEFAULT_RESULT_ARRAY})/
+
+      # Pre-transform "source" shapes the gsub_file rewrites target (as opposed to
+      # the "already applied" markers above). Each is whitespace/semicolon tolerant
+      # and anchored to a complete statement so it can't match inside a larger
+      # construct; every rewrite is applied via replace_single_match so an
+      # incidental extra match in a customized file can't corrupt it.
+      #
+      # SERVER_WEBPACK_CONFIG_IMPORT tolerates a destructured `{ default: … }` or a
+      # plain binding AND an optional trailing `.default`
+      # (`require('./serverWebpackConfig').default;`), and captures through the end
+      # of the statement so the RSC import is inserted AFTER the complete require —
+      # never before a trailing `.default`, which would produce invalid JS.
+      SERVER_WEBPACK_CONFIG_IMPORT =
+        %r{(const\s+(?:\{[^\}]*\}|\w+)\s*=\s*require\(\s*'\./serverWebpackConfig'\s*\)(?:\s*\.\s*default)?\s*;?)}
+      SERVER_CONFIG_INVOCATION = /^(\s*const\s+serverConfig\s*=\s*serverWebpackConfig\(\s*\)\s*;?)\s*$/
+      ENVSPECIFIC_DEFAULT_CALL = /envSpecific\(\s*clientConfig\s*,\s*serverConfig\s*\)\s*;?/
+      DEFAULT_BUNDLES_LOG =
+        /console\.log\(\s*'\[React on Rails\] Creating both client and server bundles\.'\s*\)\s*;?/
+
       def update_server_client_or_both_for_rsc
         config_path = resolve_server_client_or_both_path
         return unless config_path
 
+        # `content` is read once as a pre-run snapshot; every guard below checks
+        # this snapshot rather than re-reading the file after each gsub_file.
+        # That is safe only because the five transforms are textually
+        # independent — each skip-guard matches a distinct real JS shape and none
+        # of the inserted strings satisfies a later guard (e.g. the import line
+        # `const rscWebpackConfig = require(...)` never matches RSC_CONFIG_DECLARATION,
+        # whose identifier is `rscConfig`). Preserve that invariant: do not add a
+        # transform whose output would flip a later guard, or re-read `content`.
         content = File.read(File.join(destination_root, config_path))
 
-        # Skip if RSC is already configured
-        return if content.include?("rscWebpackConfig")
+        # Insert the RSC import AFTER the complete server import statement
+        # (SERVER_WEBPACK_CONFIG_IMPORT captures through an optional `.default;`).
+        unless content.match?(RSC_WEBPACK_CONFIG_IMPORT)
+          replace_single_match(
+            config_path, content, SERVER_WEBPACK_CONFIG_IMPORT,
+            "\\1\nconst rscWebpackConfig = require('./rscWebpackConfig');"
+          )
+        end
 
-        # Add RSC import after serverWebpackConfig import
-        gsub_file(
-          config_path,
-          %r{(const (?:\{ default: serverWebpackConfig \}|serverWebpackConfig) = require\('\./serverWebpackConfig'\);)},
-          "\\1\nconst rscWebpackConfig = require('./rscWebpackConfig');"
-        )
+        unless content.match?(RSC_CONFIG_DECLARATION)
+          replace_single_match(
+            config_path, content, SERVER_CONFIG_INVOCATION,
+            "\\1\n\n  const rscConfig = rscWebpackConfig();"
+          )
+        end
 
-        # Add rscConfig variable after serverConfig (with blank line separator)
-        gsub_file(
-          config_path,
-          /^(\s*const serverConfig = serverWebpackConfig\(\);)$/,
-          "\\1\n\n  const rscConfig = rscWebpackConfig();"
-        )
+        unless content.match?(ENVSPECIFIC_RSC_CALL)
+          replace_single_match(
+            config_path, content, ENVSPECIFIC_DEFAULT_CALL,
+            "envSpecific(clientConfig, serverConfig, rscConfig);"
+          )
+        end
 
-        # Update envSpecific call to include rscConfig
-        gsub_file(
-          config_path,
-          /envSpecific\(clientConfig, serverConfig\);/,
-          "envSpecific(clientConfig, serverConfig, rscConfig);"
-        )
+        insert_rsc_bundle_only_branch(config_path, content)
+
+        update_scob_default_bundle_output(config_path, content)
+      end
+
+      def insert_rsc_bundle_only_branch(config_path, content)
+        return if content.match?(RSC_BUNDLE_ONLY_BRANCH)
 
-        # Add RSC_BUNDLE_ONLY handling before the else block
         rsc_bundle_handling = <<~JS.chomp
           } else if (process.env.RSC_BUNDLE_ONLY) {
               // eslint-disable-next-line no-console
               console.log('[React on Rails] Creating only the RSC bundle.');
               result = rscConfig;
         JS
-        gsub_file(
-          config_path,
-          %r{\n(\s*\} else \{\s*\n\s*// default is the standard client and server build)},
+        # Splice in the branch only when exactly one default-build branch is
+        # identifiable (replace_single_match bails on 0 or 2+).
+        replace_single_match(
+          config_path, content, DEFAULT_BUILD_BRANCH_ANCHOR,
           "\n  #{rsc_bundle_handling}\n\\1"
         )
+      end
 
-        # Update default multi-bundle output to include RSC
-        gsub_file(
-          config_path,
-          /console\.log\('\[React on Rails\] Creating both client and server bundles\.'\);/,
-          "console.log('[React on Rails] Creating client, server, and RSC bundles.');"
-        )
-        gsub_file(
-          config_path,
-          /result = \[clientConfig, serverConfig\];/,
+      def update_scob_default_bundle_output(config_path, content)
+        unless content.match?(RSC_BUNDLES_LOG)
+          replace_single_match(
+            config_path, content, DEFAULT_BUNDLES_LOG,
+            "console.log('[React on Rails] Creating client, server, and RSC bundles.');"
+          )
+        end
+
+        return if content.match?(RSC_RESULT_ARRAY)
+
+        replace_single_match(
+          config_path, content, DEFAULT_RESULT_ARRAY,
           "result = [clientConfig, serverConfig, rscConfig];"
         )
       end
 
+      # Apply a gsub_file rewrite only when `pattern` matches exactly once in the
+      # pre-run snapshot. Thor's gsub_file rewrites every textual match, so bailing
+      # on 0 or 2+ matches keeps a customized file (an incidental extra match, or a
+      # missing anchor) from being corrupted — a miss is surfaced by
+      # check_rsc_scob_config / manual review rather than silently mis-edited.
+      def replace_single_match(config_path, content, pattern, replacement)
+        return unless content.scan(pattern).length == 1
+
+        gsub_file(config_path, pattern, replacement)
+      end
+
       def update_server_webpack_config_for_rsc
         config_path = destination_config_path("config/webpack/serverWebpackConfig.js")
         full_path = File.join(destination_root, config_path)
@@ -578,7 +663,7 @@ module ReactOnRails
           missing.concat(stale_inactive_rsc_plugin_messages(content, "serverWebpackConfig.js"))
           warn_non_object_literal_rsc_plugin_options_for_config(content)
           unless rsc_plugin_client_references_configured?(content, is_server: true)
-            missing << "generated scoped clientReferences in serverWebpackConfig.js"
+            missing << "generated manifest-backed clientReferences resolver in serverWebpackConfig.js"
           end
         elsif inactive_rsc_plugin_symbol_in_js_code?(content)
           missing << "#{rsc_plugin_class_name} in serverWebpackConfig.js " \
@@ -600,7 +685,7 @@ module ReactOnRails
           missing.concat(stale_inactive_rsc_plugin_messages(content, "clientWebpackConfig.js"))
           warn_non_object_literal_rsc_plugin_options_for_config(content)
           unless rsc_plugin_client_references_configured?(content, is_server: false)
-            missing << "generated scoped clientReferences in clientWebpackConfig.js"
+            missing << "generated manifest-backed clientReferences resolver in clientWebpackConfig.js"
           end
         elsif inactive_rsc_plugin_symbol_in_js_code?(content)
           missing << "#{rsc_plugin_class_name} in clientWebpackConfig.js " \
@@ -616,7 +701,24 @@ module ReactOnRails
         return [] unless scob_path
 
         content = File.read(File.join(destination_root, scob_path))
-        content.include?("rscWebpackConfig") ? [] : ["rscWebpackConfig in ServerClientOrBoth.js"]
+        missing = []
+        # Each check uses the SAME structural matcher as the corresponding
+        # transform's skip-guard, so a comment/string mention can neither suppress
+        # the transform nor mask its absence, and the two can never disagree.
+        missing << "rscWebpackConfig import in ServerClientOrBoth.js" unless content.match?(RSC_WEBPACK_CONFIG_IMPORT)
+        unless content.match?(RSC_CONFIG_DECLARATION)
+          missing << "rscConfig declaration (const rscConfig = rscWebpackConfig()) in ServerClientOrBoth.js"
+        end
+        unless content.match?(ENVSPECIFIC_RSC_CALL)
+          missing << "envSpecific(clientConfig, serverConfig, rscConfig) call in ServerClientOrBoth.js"
+        end
+        # The two default-branch transforms share the `} else {` anchor in
+        # insert_rsc_bundle_only_branch, which deliberately no-ops on a customized
+        # file where a single default branch can't be identified — so their success
+        # is NOT implied by the invocation above and a silent miss must be surfaced.
+        missing << "RSC_BUNDLE_ONLY branch in ServerClientOrBoth.js" unless content.match?(RSC_BUNDLE_ONLY_BRANCH)
+        missing << "RSC-aware default result array in ServerClientOrBoth.js" unless content.match?(RSC_RESULT_ARRAY)
+        missing
       end
 
       def warn_non_object_literal_rsc_plugin_options_for_config(content)
@@ -640,7 +742,7 @@ module ReactOnRails
         @non_object_literal_rsc_plugin_options_warned = true
         GeneratorMessages.add_warning(
           "#{rsc_plugin_class_name} calls use non-object-literal options in one or more bundler configs, " \
-          "so the generator cannot verify whether scoped clientReferences are configured. " \
+          "so the generator cannot verify whether the generated manifest-backed resolver is configured. " \
           "Please verify your bundler configs manually."
         )
       end

data/lib/generators/react_on_rails/templates/agent_files/AGENTS.md

@@ -149,13 +149,41 @@ A Redux store wasn't registered before a component that depends on it rendered.
 
 ## 6. Diagnose your setup
 
-Before guessing, run the doctor — it checks configuration, bundles, and dependencies:
+Before guessing, run the doctor in its stable machine-readable mode — it checks
+configuration, bundles, and dependencies and returns copy-promptable remediation:
 
 ```bash
-bin/rails react_on_rails:doctor
+bin/rails react_on_rails:doctor FORMAT=json
 ```
 
-## 7. Where the full reference lives
+Exit code `0` means there are no errors (warnings may still be present); exit code
+`1` means at least one error must be fixed. Use each non-passing check's stable
+`id`, `severity`, `message`, and `remediation.prompt`, then rerun the command until
+the report no longer contains errors. The JSON contract is documented at
+https://reactonrails.com/docs/api-reference/doctor.
+
+## 7. Use the bundled docs and skills first
+
+Use the installed gem directory as the canonical, reliable lookup for version-matched
+guidance:
+
+```bash
+bundle show react_on_rails
+```
+
+From the returned directory, read `docs/agent/README.md` and load the matching workflow
+skill when the task fits:
+
+- Install or upgrade: `skills/install-and-upgrade/SKILL.md`
+- Adopt React Server Components (Pro): `skills/rsc-adoption/SKILL.md`
+- Debug streaming SSR (Pro): `skills/streaming-debug/SKILL.md`
+- Run the doctor fix loop: `skills/doctor-fix-loop/SKILL.md`
+
+An optional direct-dependency path is `node_modules/react-on-rails/`, but use it only when
+that directory exists. Do not assume it exists: Pro installations may omit the direct base
+npm dependency, and pnpm may isolate a transitive copy.
+
+## 8. Where the hosted reference lives
 
 - Hosted docs: https://reactonrails.com/docs/
 - Getting-started tutorial: https://reactonrails.com/docs/getting-started/tutorial/

data/lib/generators/react_on_rails/templates/base/base/{Procfile.dev-static-assets → Procfile.dev-static-assets.tt}

@@ -1,2 +1,2 @@
 web: bin/rails server -p ${PORT:-3000}
-js: bin/shakapacker-watch --watch
+js: <%= shakapacker_watch_command %>

data/lib/generators/react_on_rails/templates/base/base/{Procfile.dev → Procfile.dev.tt}

@@ -7,4 +7,4 @@
 # For manual worktree setup (no base-port tool), see .env.example.
 rails: bundle exec rails s -p ${PORT:-3000}
 dev-server: bin/shakapacker-dev-server
-server-bundle: SERVER_BUNDLE_ONLY=true bin/shakapacker-watch --watch
+server-bundle: SERVER_BUNDLE_ONLY=true <%= shakapacker_watch_command %>

data/lib/generators/react_on_rails/templates/base/base/config/webpack/serverWebpackConfig.js.tt

@@ -1,6 +1,6 @@
 <%= add_documentation_reference(config[:message], "// https://github.com/shakacode/react-on-rails-demo-ssr-hmr/blob/master/config/webpack/serverWebpackConfig.js") %>
 
-const { merge, config } = require('shakapacker');
+const { config } = require('shakapacker');
 const commonWebpackConfig = require('./commonWebpackConfig');
 
 const bundler = config.assets_bundler === 'rspack'
@@ -17,18 +17,18 @@ const rscClientReferences = {
 };
 <% end -%>
 
+// Normalizes an entry of a webpack/rspack `rule.use` array to its loader path.
+// Entries may be a bare string, a `{ loader, options }` object, or null.
+function getLoaderPath(item) {
+  if (typeof item === 'string') return item;
+  if (item && typeof item.loader === 'string') return item.loader;
+  return '';
+}
+
 <% if use_pro? -%>
 function extractLoader(rule, loaderName) {
   if (!Array.isArray(rule.use)) return null;
-  return rule.use.find((item) => {
-    let testValue = '';
-    if (typeof item === 'string') {
-      testValue = item;
-    } else if (item && typeof item.loader === 'string') {
-      testValue = item.loader;
-    }
-    return testValue.includes(loaderName);
-  });
+  return rule.use.find((item) => getLoaderPath(item).includes(loaderName));
 }
 
 <% end -%>
@@ -38,10 +38,6 @@ const configureServer = (rscBundle = false) => {
 <% else -%>
 const configureServer = () => {
 <% end -%>
-  // We need to use "merge" because the clientConfigObject, EVEN after running
-  // toWebpackConfig() is a mutable GLOBAL. Thus any changes, like modifying the
-  // entry value will result in changing the client config!
-  // Using webpack-merge into an empty object avoids this issue.
   const serverWebpackConfig = commonWebpackConfig();
 
   // We just want the single server bundle entry
@@ -63,15 +59,10 @@ const configureServer = () => {
   serverWebpackConfig.module.rules.forEach((loader) => {
     if (loader.use && loader.use.filter) {
       loader.use = loader.use.filter((item) => {
-        let testValue = '';
-        if (typeof item === 'string') {
-          testValue = item;
-        } else if (item && typeof item.loader === 'string') {
-          testValue = item.loader;
-        }
+        const loaderPath = getLoaderPath(item);
         return !(
-          testValue.includes('mini-css-extract-plugin') ||
-          testValue.includes('cssExtractLoader') // Rspack uses this path
+          loaderPath.includes('mini-css-extract-plugin') ||
+          loaderPath.includes('cssExtractLoader') // Rspack uses this path
         );
       });
     }
@@ -162,29 +153,14 @@ const configureServer = () => {
     if (Array.isArray(rule.use)) {
       // remove the mini-css-extract-plugin and style-loader
       rule.use = rule.use.filter((item) => {
-        let testValue = '';
-        if (typeof item === 'string') {
-          testValue = item;
-        } else if (item && typeof item.loader === 'string') {
-          testValue = item.loader;
-        }
+        const loaderPath = getLoaderPath(item);
         return !(
-          testValue.includes('mini-css-extract-plugin') ||
-          testValue.includes('cssExtractLoader') || // Rspack uses this path
-          testValue === 'style-loader'
+          loaderPath.includes('mini-css-extract-plugin') ||
+          loaderPath.includes('cssExtractLoader') || // Rspack uses this path
+          loaderPath === 'style-loader'
         );
       });
-      const cssLoader = rule.use.find((item) => {
-        let testValue = '';
-
-        if (typeof item === 'string') {
-          testValue = item;
-        } else if (item && typeof item.loader === 'string') {
-          testValue = item.loader;
-        }
-
-        return testValue.includes('css-loader');
-      });
+      const cssLoader = rule.use.find((item) => getLoaderPath(item).includes('css-loader'));
       if (cssLoader && cssLoader.options && cssLoader.options.modules) {
         cssLoader.options.modules = {
           ...(typeof cssLoader.options.modules === 'object' ? cssLoader.options.modules : {}),