Migrate from Babel to SWC transpiler

[justin808]

Background

Shakapacker 9.0.0-beta.7+ makes SWC the default JavaScript transpiler instead of Babel. This tutorial currently uses Babel for transpilation.

Benefits of SWC

• Performance: SWC is significantly faster than Babel (10-20x for large codebases)
• Modern default: Aligns with Shakapacker 9.0 defaults
• Active development: SWC is actively maintained and optimized
• Lower memory footprint: Uses less memory during builds

Migration Plan

1. Configuration Changes

• Remove Babel-specific dependencies from package.json:
  • @babel/cli
  • @babel/core
  • @babel/plugin-transform-runtime
  • @babel/preset-env
  • @babel/preset-react
  • @babel/eslint-parser
  • babel-loader
  • babel-jest
  • babel-plugin-macros
  • babel-plugin-transform-react-remove-prop-types
• Update shakapacker.yml to set javascript_transpiler: swc
• Create .swcrc configuration file with equivalent settings
• Update ESLint parser if needed

2. SWC Configuration

Create a .swcrc file with settings equivalent to current Babel config:

{
  "jsc": {
    "parser": {
      "syntax": "ecmascript",
      "jsx": true
    },
    "transform": {
      "react": {
        "runtime": "automatic",
        "development": false,
        "refresh": true
      }
    },
    "target": "es2015"
  },
  "module": {
    "type": "es6"
  }
}

3. Testing

• Run full test build: yarn build:test
• Run development build: yarn build:dev
• Test HMR functionality
• Verify React Fast Refresh works
• Run all Jest tests
• Check that code splitting still works

4. Documentation Updates

• Update README with SWC configuration
• Document any behavioral differences from Babel
• Update troubleshooting guide

Potential Issues

1. Babel macros: SWC doesn't support Babel macros - need to find alternatives or remove
2. Custom Babel plugins: Any custom plugins will need SWC equivalents
3. Jest configuration: May need to update Jest to work with SWC
4. ESLint parser: May need to switch from @babel/eslint-parser

References

• Shakapacker SWC Documentation
• SWC Configuration
• SWC vs Babel Performance

Acceptance Criteria

• All builds pass (test, development, production)
• No Babel dependencies remain
• Build time is noticeably faster
• All existing functionality works identically
• Documentation is updated

cc: @justin808