Vite 3.0 generate different code between development and production

[IWANABETHATGUY]

Describe the bug

1. run pnpm dev and open the browser render below
   
2. run pnpm build and live-server dist render below:
   

Reproduction

https://github.com/IWANABETHATGUY/vite-codegen-issue

System Info

Binaries:
    Node: 18.2.0 - /tmp/fnm_multishells/188949_1658144339703/bin/node
    Yarn: 1.22.19 - ~/.local/share/pnpm/yarn
    npm: 8.9.0 - /tmp/fnm_multishells/188949_1658144339703/bin/npm
  Browsers:
    Chrome: 103.0.5060.114
    Firefox: 102.0.1
  npmPackages:
    vite: ^3.0.0 => 3.0.1

Used Package Manager

pnpm

Logs

No response

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.

[sapphi-red]

It worked correctly when you opt-in esbuild deps optimization at build time.
https://vitejs.dev/guide/migration.html#using-esbuild-deps-optimization-at-build-time

Also it worked with 3.0.0-beta.2 but didn't work with 3.0.0-beta.3.
https://stackblitz.com/edit/github-rfkfeg?file=package.json,main.js,vite.config.js
Maybe @rollup/plugin-commonjs v22 is affecting this (#8743).

[sapphi-red]

Closing as I confirmed this is already fixed in 3.0.9.

[IWANABETHATGUY]

Thanks