Simplify CSS loader configuration in webpack common config

- Use straightforward module rules approach instead of complex merge logic
- Ensure CSS files are properly processed by webpack
- Add basic style-loader and css-loader configuration

Author: justin808

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

@@ -9,33 +9,17 @@ const commonOptions = {
   resolve: {
     extensions: ['.css', '.ts', '.tsx'],
   },
+  module: {
+    rules: [
+      {
+        test: /\.css$/i,
+        use: ['style-loader', 'css-loader'],
+      },
+    ],
+  },
 };
 
 // Copy the object using merge b/c the baseClientWebpackConfig and commonOptions are mutable globals
-const commonWebpackConfig = () => {
-  const config = merge({}, baseClientWebpackConfig, commonOptions);
-
-  // Ensure CSS loader is properly configured
-  if (!config.module) {
-    config.module = {};
-  }
-  if (!config.module.rules) {
-    config.module.rules = [];
-  }
-
-  // Add CSS loader rule if not already present
-  const hasCssRule = config.module.rules.some(rule =>
-    rule.test && rule.test.toString().includes('css')
-  );
-
-  if (!hasCssRule) {
-    config.module.rules.push({
-      test: /\.css$/i,
-      use: ['style-loader', 'css-loader'],
-    });
-  }
-
-  return config;
-};
+const commonWebpackConfig = () => merge({}, baseClientWebpackConfig, commonOptions);
 
 module.exports = commonWebpackConfig;