Add experimental flag to force SWC transforms (#36789)

fixes #36763
fixes #36590

## Feature

- [x] Implements an existing feature request or RFC. Make sure the feature request has been accepted for implementation before opening a PR.
   - It hasn't been accepted for implementation, although that process isn't clear, and this is a pretty trivial fix.
- [x] Related issues linked using `fixes #number`
- [x] Integration tests added
- [x] Documentation added
- [ ] Telemetry added. In case of a feature if it's used or not.
   - This is somewhat inherent in the error log
- [x] Errors have helpful link attached, see `contributing.md`

## Documentation / Examples

- [x] Make sure the linting passes by running `yarn lint`

errors/swc-disabled.md

@@ -13,3 +13,16 @@ Many of the integrations with external libraries that currently require custom B
 - Emotion
 
 In order to prioritize transforms that will help you adopt SWC please provide your `.babelrc` on [the feedback thread](https://github.com/vercel/next.js/discussions/30174).
+
+#### Possible Ways to Fix It
+
+If you want to use SWC despite the presence of a `.babelrc` file you can force it in your `next.config.js` file.
+
+```js
+// next.config.js
+module.exports = {
+  experimental: {
+    forceSwcTransforms: true,
+  },
+}
+```

packages/next/build/webpack-config.ts

@@ -411,7 +411,7 @@ export default async function getBaseWebpackConfig(
 
   const distDir = path.join(dir, config.distDir)
 
-  let useSWCLoader = !babelConfigFile
+  let useSWCLoader = !babelConfigFile || config.experimental.forceSwcTransforms
   let SWCBinaryTarget: [Feature, boolean] | undefined = undefined
   if (useSWCLoader) {
     // TODO: we do not collect wasm target yet

packages/next/server/config-shared.ts

@@ -135,6 +135,7 @@ export interface ExperimentalConfig {
     }
   >
   swcTraceProfiling?: boolean
+  forceSwcTransforms?: boolean
 }
 
 /**
@@ -505,6 +506,7 @@ export const defaultConfig: NextConfig = {
       layoutRaw: false,
       remotePatterns: [],
     },
+    forceSwcTransforms: false,
   },
 }
 

test/e2e/swc-warnings/index.test.ts

@@ -0,0 +1,68 @@
+import { createNext } from 'e2e-utils'
+import { NextInstance } from 'test/lib/next-modes/base'
+import { renderViaHTTP } from 'next-test-utils'
+
+describe('swc warnings by default', () => {
+  let next: NextInstance
+
+  beforeAll(async () => {
+    next = await createNext({
+      files: {
+        'pages/index.js': `
+          export default function Page() { 
+            return <p>hello world</p>
+          } 
+        `,
+        '.babelrc': `
+          {
+            "presets": ["next/babel"]
+          }
+        `,
+      },
+      dependencies: {},
+    })
+  })
+  afterAll(() => next.destroy())
+
+  it('should have warning', async () => {
+    await renderViaHTTP(next.url, '/')
+    expect(next.cliOutput).toContain(
+      'Disabled SWC as replacement for Babel because of custom Babel configuration'
+    )
+  })
+})
+
+describe('can force swc', () => {
+  let next: NextInstance
+
+  beforeAll(async () => {
+    next = await createNext({
+      nextConfig: {
+        experimental: {
+          forceSwcTransforms: true,
+        },
+      },
+      files: {
+        'pages/index.js': `
+          export default function Page() { 
+            return <p>hello world</p>
+          } 
+        `,
+        '.babelrc': `
+          {
+            "presets": ["next/babel"]
+          }
+        `,
+      },
+      dependencies: {},
+    })
+  })
+  afterAll(() => next.destroy())
+
+  it('should not have warning', async () => {
+    await renderViaHTTP(next.url, '/')
+    expect(next.cliOutput).not.toContain(
+      'Disabled SWC as replacement for Babel because of custom Babel configuration'
+    )
+  })
+})