Issues with pre transform step

[ak-adversus]

Describe the bug

Vite breaks when trying to run the pre-transform step on the following code:

const brokenFunction = () => ({
	foo: 'bar',
}) as { foo: 'bar' }

This throws the following error

Plugin: vite:esbuild

  Expected ";" but found "as"
  4  |  const brokenFunction = () => {
  5  |    foo: 'bar'
  6  |  } as {foo: 'bar';};
     |    ^
  7  |
  8  |  const Broken = () => {

From the error log, it seems that at some point, the parentheses wrapping the object have been removed, which causes the broken syntax.

I have tested this on the vanilla-ts and react-ts templates, but it's only broken in the react-ts template, i don't know about any other framework.

Reproduction

https://stackblitz.com/edit/vitejs-vite-fdiygv

Steps to reproduce

No response

System Info

System:
    OS: Windows 11 10.0.22631
    CPU: (20) x64 12th Gen Intel(R) Core(TM) i7-12700H
    Memory: 1.93 GB / 15.68 GB
  Binaries:
    Node: 20.11.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.2.4 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Chromium (126.0.2592.102)
    Internet Explorer: 11.0.22621.3527
  npmPackages:
    @vitejs/plugin-react: 4.2.0 => 4.2.0
    vite: 5.0.0 => 5.0.0

Used Package Manager

npm

Logs

Full error log!

11.15.08 [vite] Internal server error: Transform failed with 1 error:
C:/Users/name/project/src/main.tsx:6:2: ERROR: Expected ";" but found "as"
  Plugin: vite:esbuild
  File: C:/Users/name/project/src/main.tsx:6:1

  Expected ";" but found "as"
  4  |  const brokenFunction = () => {
  5  |    foo: 'bar'
  6  |  } as {foo: 'bar';};
     |    ^
  7  |
  8  |  const Broken = () => {

      at failureErrorWithLog (C:\Users\name\project\node_modules\esbuild\lib\main.js:1651:15)
      at C:\Users\name\project\node_modules\esbuild\lib\main.js:849:29
      at responseCallbacks.<computed> (C:\Users\name\project\node_modules\esbuild\lib\main.js:704:9)
      at handleIncomingPacket (C:\Users\name\project\node_modules\esbuild\lib\main.js:764:9)
      at Socket.readFromStdout (C:\Users\name\project\node_modules\esbuild\lib\main.js:680:7)
      at Socket.emit (node:events:518:28)
      at addChunk (node:internal/streams/readable:559:12)
      at readableAddChunkPushByteMode (node:internal/streams/readable:510:3)
      at Readable.push (node:internal/streams/readable:390:5)
      at Pipe.onStreamRead (node:internal/stream_base_commons:190:23)
11.15.08 [vite] Pre-transform error: Transform failed with 1 error:
C:/Users/name/project/src/main.tsx:6:2: ERROR: Expected ";" but found "as"

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Make sure this is a Vite issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to vuejs/core instead.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[stackblitz]

Start a new pull request in StackBlitz Codeflow.

• vitejs-vite-fdiygv (Open reproduction)

[bluwy]

Looks like some react babel transforms is affecting it:

I'll move this to the plugin-react repo for now, but it could be other dependencies affecting this.

[bluwy]

Oh it looks like someone already opened an issue for this #348. I'll close this in favour of that then.