Migrate from Babel to SWC transpiler with Shakapacker 9.0.0-beta.11

This PR migrates the JavaScript/TypeScript build pipeline from Babel to SWC
for significantly faster compilation times while maintaining full compatibility.

Key Changes:
- Upgrade Shakapacker from 9.0.0-beta.8 to 9.0.0-beta.11
- Switch javascript_transpiler from babel to swc in shakapacker.yml
- Add config/swc.config.js with ES2022 target and Stimulus-compatible settings
- Remove babel.config.js and most Babel build dependencies
- Retain minimal Babel packages (@babel/core, @babel/preset-react) for ESLint
- Configure ESLint to use @babel/preset-react for JSX parsing
- Update Jest to use @swc/jest for test transpilation

Technical Details:
- SWC configured with target: es2022 to preserve modern class features
- keepClassNames: true ensures Stimulus controller compatibility
- Module type set to es6 to preserve ES module semantics
- Babel retained only for linting, not for build/runtime transpilation

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

Co-Authored-By: Claude <noreply@anthropic.com>

Author: justin808

.eslintrc

@@ -5,6 +5,12 @@ extends:
   - plugin:jsx-a11y/recommended
   - prettier
 
+parserOptions:
+  requireConfigFile: false
+  babelOptions:
+    presets:
+      - "@babel/preset-react"
+
 plugins:
   - react
   - jsx-a11y

Gemfile

@@ -6,7 +6,7 @@ git_source(:github) { |repo| "https://github.com/#{repo}.git" }
 ruby "3.4.6"
 
 gem "react_on_rails", "16.1.1"
-gem "shakapacker", "9.0.0.beta.8"
+gem "shakapacker", "9.0.0.beta.11"
 
 # Bundle edge Rails instead: gem "rails", github: "rails/rails"
 gem "listen"

Gemfile.lock

@@ -383,7 +383,7 @@ GEM
       websocket (~> 1.0)
     semantic_range (3.1.0)
     sexp_processor (4.17.1)
-    shakapacker (9.0.0.beta.8)
+    shakapacker (9.0.0.beta.11)
       activesupport (>= 5.2)
       package_json
       rack-proxy (>= 0.6.1)
@@ -493,7 +493,7 @@ DEPENDENCIES
   scss_lint
   sdoc
   selenium-webdriver (~> 4)
-  shakapacker (= 9.0.0.beta.8)
+  shakapacker (= 9.0.0.beta.11)
   spring
   spring-commands-rspec
   stimulus-rails (~> 1.3)
@@ -502,7 +502,7 @@ DEPENDENCIES
   web-console
 
 RUBY VERSION
-   ruby 3.4.6p54
+   ruby 3.4.6p0
 
 BUNDLED WITH
    2.4.17

babel.config.js

@@ -8,15 +8,15 @@ default: &default
   cache_path: tmp/shakapacker
   webpack_compile_output: true
   nested_entries: true
-  javascript_transpiler: babel
+  javascript_transpiler: swc
 
   # Additional paths webpack should lookup modules
   # ['app/assets', 'engine/foo/app/assets']
   additional_paths: []
 
   # Reload manifest.json on all requests so we reload latest compiled packs
   cache_manifest: false
-  
+
   # Use the config.build_production_command in config/initializers/react_on_rails.rb
   shakapacker_precompile: false
 

config/shakapacker.yml

@@ -0,0 +1,37 @@
+// config/swc.config.js
+// This file is merged with Shakapacker's default SWC configuration
+// See: https://swc.rs/docs/configuration/compilation
+
+module.exports = {
+  jsc: {
+    parser: {
+      syntax: 'ecmascript',
+      jsx: true,
+      dynamicImport: true,
+      decorators: false,
+    },
+    transform: {
+      react: {
+        runtime: 'automatic',
+      },
+      // Disable optimizer to preserve class structure for Stimulus
+      optimizer: {
+        globals: {
+          vars: {},
+        },
+      },
+    },
+    // Critical for Stimulus: preserve class names and method bindings
+    keepClassNames: true,
+    // Use spec-compliant class transforms (not loose mode)
+    loose: false,
+    // Don't use external helpers
+    externalHelpers: false,
+    // Target ES2022 to avoid transforming class features
+    target: 'es2022',
+  },
+  // Preserve ES6 module semantics
+  module: {
+    type: 'es6',
+  },
+};

config/swc.config.js

@@ -31,12 +31,8 @@
     "build:clean": "rm -rf public/packs || true"
   },
   "dependencies": {
-    "@babel/cli": "^7.21.0",
-    "@babel/core": "^7.21.0",
-    "@babel/plugin-transform-runtime": "^7.21.0",
-    "@babel/preset-env": "^7.20.2",
-    "@babel/preset-react": "^7.18.6",
     "@babel/runtime": "^7.17.9",
+    "@swc/core": "^1.3.100",
     "@glennsl/rescript-fetch": "^0.2.0",
     "@glennsl/rescript-json-combinators": "^1.2.1",
     "@hotwired/stimulus": "^3.2.1",
@@ -47,9 +43,6 @@
     "@rescript/react": "^0.11.0",
     "autoprefixer": "^10.4.14",
     "axios": "^0.21.1",
-    "babel-loader": "^9.1.2",
-    "babel-plugin-macros": "^3.1.0",
-    "babel-plugin-transform-react-remove-prop-types": "^0.4.24",
     "classnames": "^2.3.2",
     "compression-webpack-plugin": "10.0.0",
     "css-loader": "^6.7.3",
@@ -103,14 +96,17 @@
     "webpack": "5",
     "webpack-assets-manifest": "5",
     "webpack-cli": "5",
-    "webpack-merge": "5"
+    "webpack-merge": "5",
+    "swc-loader": "^0.2.6"
   },
   "devDependencies": {
+    "@babel/core": "^7.21.0",
     "@babel/eslint-parser": "^7.16.5",
+    "@babel/preset-react": "^7.18.6",
     "@pmmmwh/react-refresh-webpack-plugin": "^0.5.10",
+    "@swc/jest": "^0.2.29",
     "@tailwindcss/typography": "^0.5.10",
     "@webpack-cli/serve": "^2.0.5",
-    "babel-jest": "^29.5.0",
     "body-parser": "^1.20.2",
     "eslint": "^8.35.0",
     "eslint-config-prettier": "^8.6.0",
@@ -155,7 +151,7 @@
     ],
     "testRegex": "./app/.*.spec\\.jsx?$",
     "transform": {
-      "^.+\\.jsx?$": "babel-jest"
+      "^.+\\.jsx?$": "@swc/jest"
     }
   },
   "packageManager": "yarn@1.22.22+sha512.a6b2f7906b721bba3d67d4aff083df04dad64c399707841b7acf00f6b133b7ac24255f2652fa22ae3534329dc6180534e98d17432037ff6fd140556e2bb3137e"