Repository: next.js
Issue: custom babel configuration not working
Labels: bug

### Verify canary release

- [X] I verified that the issue exists in the latest Next.js canary release

### Provide environment information

 Operating System:
      Platform: darwin
      Arch: arm64
      Version: Darwin Kernel Version 20.5.0: Sat May  8 05:10:31 PDT 2021; root:xnu-7195.121.3~9/RELEASE_ARM64_T8101
    Binaries:
      Node: 16.13.1
      npm: 8.1.2
      Yarn: 1.22.10
      pnpm: 7.0.0-rc.2
    Relevant packages:
      next: 13.0.7
      eslint-config-next: 13.0.7
      react: 18.2.0
      react-dom: 18.2.0

warn  - Latest canary version not detected, detected: "13.0.7", newest: "13.0.8-canary.3".
        Please try the latest canary version (`npm install next@canary`) to confirm the issue still exists before creating a new issue.
        Read more - https://nextjs.org/docs/messages/opening-an-issue
✨  Done in 2.14s.

### Which area(s) of Next.js are affected? (leave empty if unsure)

_No response_

### Link to the code that reproduces this issue

https://github.com/yaohuangguan/reproduction-next-babel

### To Reproduce

https://github.com/yaohuangguan/reproduction-next-babel

### Describe the Bug

so my babel.config.json is like this
```json
{
  "presets": [
    [
      "next/babel",
      {
        "preset-env": {
          "targets": {
            "browsers": [
              "> 1%",
              "last 2 versions",
              "safari >= 7",
              "ios >= 7",
              "chrome >= 50"
            ]
          },
          "debug": true,
          "useBuiltIns": "usage",
          "corejs": "3",
          "forceAllTransforms": true
        }
      }
    ]
  ],
  "plugins": [
    "@babel/plugin-transform-arrow-functions",
    "@babel/plugin-proposal-optional-chaining",
    "@babel/plugin-proposal-nullish-coalescing-operator",
    "@babel/plugin-proposal-object-rest-spread",
    "@babel/plugin-proposal-class-properties",
    "babel-plugin-styled-components"
  ],
  "sourceMaps": "both"
}

```

Technically, it should transform to the code that can be running on safari 12 or larger than safari 7. In fact, my ios 12, safari 12 still cannot open it. i suspect that the 3rd party script involves the es6 code so no matter how i configure babel, the es6 code still exist. 

Given the error `Unexpected token '?'` Because it is minified code, can't really see where the error came from, even though i turned on the productionSourcemap to true. 
![img_v2_72d61b4e-7f68-4d33-b6e7-651e5d126eeg](https://user-images.githubusercontent.com/43796777/209063430-8f132d16-c838-4629-93e8-b21d8bd88e8c.jpg)

![image](https://user-images.githubusercontent.com/43796777/209060322-24a47dda-cb85-468c-bf6e-a88c590f4e1b.png)


Also i tried es5-validator to postbuild, any es6 code exists
![image](https://user-images.githubusercontent.com/43796777/209052071-88c06645-b9fa-49a6-a7b0-b2dcc4febc57.png)

Also wanna inquire nextjs side, if there's option to force to let all 3rd party scirpt to be transformed. could you help explain what should i do to transform all the code in my application to es5? 

I found out a reference for vite to add a plugin to polyfill all legacy code, like this, see if nextjs can have similar settings in next.config.js
https://github.com/vitejs/vite/tree/main/packages/plugin-legacy

Thank you!


### Expected Behavior

safari12 can open the page

### Which browser are you using? (if relevant)

safari 12

### How are you deploying your application? (if relevant)

next export