Fix CSS modules webpack loader syntax error

The previous data URI loader approach violated webpack's modern syntax rules.
This fix uses NormalModuleReplacementPlugin instead to replace CSS module
imports with a mock proxy object that provides identity mapping for any
property access.

This approach works with webpack 5's stricter loader rules while still
providing the necessary fallback behavior for test environments.

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <[email protected]>

Author: justin808

lib/generators/react_on_rails/templates/base/base/config/webpack/commonWebpackConfig.js.tt

@@ -44,16 +44,16 @@ if (cssLoaderAvailable && MiniCssExtractPlugin) {
     ],
   };
 } else {
-  // Fallback: provide identity object for CSS modules (for testing)
-  commonOptions.module = {
-    rules: [
-      {
-        test: /\.module\.css$/i,
-        type: 'javascript/auto',
-        loader: 'data:text/javascript,module.exports=new Proxy({},{get:function(target,prop){return prop==="default"?this:prop}})',
-      },
-    ],
-  };
+  // Fallback: replace CSS module imports with a mock module (for testing)
+  const webpack = require('webpack');
+
+  commonOptions.plugins = commonOptions.plugins || [];
+  commonOptions.plugins.push(
+    new webpack.NormalModuleReplacementPlugin(
+      /\.module\.css$/,
+      'data:text/javascript,module.exports = new Proxy({}, {get: function(target, prop) {return prop === "default" ? this : prop;}})'
+    )
+  );
 }
 
 // Copy the object using merge b/c the baseClientWebpackConfig and commonOptions are mutable globals