Merge pull request Expensify#71646 from callstack-internal/perf/production-bundle-cleanup

[No QA] perf: production bundle cleanup

Author: roryabraham

babel.config.js

@@ -3,7 +3,7 @@ require('dotenv').config();
 const IS_E2E_TESTING = process.env.E2E_TESTING === 'true';
 
 const ReactCompilerConfig = {
-    target: '18',
+    target: '19',
     environment: {
         enableTreatRefLikeIdentifiersAsRefs: true,
     },

config/webpack/webpack.common.ts

@@ -3,6 +3,7 @@ import CopyPlugin from 'copy-webpack-plugin';
 import dotenv from 'dotenv';
 import fs from 'fs';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
+import MiniCssExtractPlugin from 'mini-css-extract-plugin';
 import path from 'path';
 import TerserPlugin from 'terser-webpack-plugin';
 import type {Class} from 'type-fest';
@@ -166,6 +167,7 @@ const getCommonConfiguration = ({file = '.env', platform = 'web'}: Environment):
                 // eslint-disable-next-line @typescript-eslint/naming-convention
                 __DEV__: /staging|prod|adhoc/.test(file) === false,
             }),
+            ...(isDevelopment ? [] : [new MiniCssExtractPlugin()]),
 
             // This allows us to interactively inspect JS bundle contents
             ...(process.env.ANALYZE_BUNDLE === 'true' ? [new BundleAnalyzerPlugin()] : []),
@@ -232,7 +234,7 @@ const getCommonConfiguration = ({file = '.env', platform = 'web'}: Environment):
                 },
                 {
                     test: /\.css$/i,
-                    use: ['style-loader', 'css-loader'],
+                    use: isDevelopment ? ['style-loader', 'css-loader'] : [MiniCssExtractPlugin.loader, 'css-loader'],
                 },
                 {
                     test: /\.(woff|woff2)$/i,

package-lock.json

@@ -80,6 +80,7 @@
     "compress-svg": "npx ts-node scripts/compressSvg.ts --dir assets/images"
   },
   "dependencies": {
+    "@babel/runtime": "^7.25.0",
     "@dnd-kit/core": "^6.3.1",
     "@dnd-kit/modifiers": "^9.0.0",
     "@dnd-kit/sortable": "^10.0.0",
@@ -161,6 +162,7 @@
     "react-dom": "19.0.0",
     "react-error-boundary": "^4.0.11",
     "react-fast-pdf": "^1.0.29",
+    "react-is": "^18.3.1",
     "react-map-gl": "^7.1.3",
     "react-native": "0.79.2",
     "react-native-advanced-input-mask": "1.4.4",
@@ -226,7 +228,6 @@
     "@babel/preset-flow": "^7.12.13",
     "@babel/preset-react": "^7.10.4",
     "@babel/preset-typescript": "^7.21.5",
-    "@babel/runtime": "^7.25.0",
     "@babel/traverse": "^7.22.20",
     "@babel/types": "^7.22.19",
     "@callstack/reassure-compare": "^1.0.0-rc.4",
@@ -298,7 +299,7 @@
     "babel-jest": "29.7.0",
     "babel-loader": "^9.1.3",
     "babel-plugin-module-resolver": "^5.0.0",
-    "babel-plugin-react-compiler": "^19.0.0-beta-8a03594-20241020",
+    "babel-plugin-react-compiler": "^19.0.0-beta-ebf51a3-20250411",
     "babel-plugin-react-native-web": "^0.18.7",
     "babel-plugin-transform-remove-console": "^6.9.4",
     "clean-webpack-plugin": "^4.0.0",
@@ -337,6 +338,7 @@
     "jest-when": "^3.5.2",
     "link": "^2.1.1",
     "memfs": "^4.6.0",
+    "mini-css-extract-plugin": "^2.9.4",
     "nitrogen": "0.29.4",
     "onchange": "^7.1.0",
     "openai": "5.5.1",
@@ -346,7 +348,6 @@
     "prettier": "3.5.3",
     "react-compiler-healthcheck": "^19.0.0-beta-8a03594-20241020",
     "react-compiler-runtime": "^19.0.0-beta-8a03594-20241020",
-    "react-is": "^18.3.1",
     "react-native-clean-project": "^4.0.0-alpha4.0",
     "react-refresh": "^0.14.2",
     "react-test-renderer": "19.0.0",