Error when trying to run dev server with default React TS template

[AltStuff]

Describe the bug

Ran

yarn create vite

Picked React and typescript, also happens with react js

cd test
yarn
yarn dev

Throws errors

Doesn't happen with vanilla js nor typescript, only react

Reproduction

yarn create vite & cd test & yarn & yarn dev

System Info

System:
    OS: Windows 10 10.0.19043
    CPU: (16) x64 AMD Ryzen 7 4800H with Radeon Graphics
    Memory: 10.24 GB / 15.42 GB
  Binaries:
    Node: 17.9.0 - D:\tools\nvm\nodejs\node.EXE
    Yarn: 1.22.15 - D:\tools\nvm\nodejs\yarn.CMD
    npm: 8.5.5 - D:\tools\nvm\nodejs\npm.CMD
  Browsers:
    Edge: Spartan (44.19041.1266.0), Chromium (100.0.1185.36)
    Internet Explorer: 11.0.19041.1566
  npmPackages:
    @vitejs/plugin-react: ^1.0.7 => 1.3.0
    vite: ^2.9.0 => 2.9.1

Used Package Manager

yarn

Logs

$ vite

  vite v2.9.1 dev server running at:

  > Local: http://localhost:3000/
  > Network: use `--host` to expose

  ready in 271ms.

✘ [ERROR] [plugin vite:dep-pre-bundle] Detected inconsistent metadata for the path "node_modules/react/index.js" when it was imported here:

    node_modules/react/cjs/react-jsx-dev-runtime.development.js:16:20:
      16 │ var React = require('react');
         ╵                     ~~~~~~~

  The original metadata for that path comes from when it was imported here:

    dep:react:1:23:
      1 │ export default require("./node_modules/react/index.js");
        ╵                        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  The difference in metadata is displayed below:

   {
  -  "pluginName": null,
  +  "pluginName": "vite:dep-pre-bundle",
   }

  This is a bug in the "vite:dep-pre-bundle" plugin. Plugins provide metadata for a given path in an
  "onResolve" callback. All metadata provided for the same path must be consistent to ensure
  deterministic builds. Due to parallelism, one set of provided metadata will be randomly chosen for
  a given path, so providing inconsistent metadata for the same path can cause non-determinism.

✘ [ERROR] [plugin vite:dep-pre-bundle] Detected inconsistent metadata for the path "node_modules/react/index.js" when it was imported here:

    node_modules/react-dom/cjs/react-dom.development.js:16:20:
      16 │ var React = require('react');
         ╵                     ~~~~~~~

  The original metadata for that path comes from when it was imported here:

    dep:react:1:23:
      1 │ export default require("./node_modules/react/index.js");
        ╵                        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  The difference in metadata is displayed below:

   {
  -  "pluginName": null,
  +  "pluginName": "vite:dep-pre-bundle",
   }

  This is a bug in the "vite:dep-pre-bundle" plugin. Plugins provide metadata for a given path in an
  "onResolve" callback. All metadata provided for the same path must be consistent to ensure
  deterministic builds. Due to parallelism, one set of provided metadata will be randomly chosen for
  a given path, so providing inconsistent metadata for the same path can cause non-determinism.

10:49:37 PM [vite] error while updating dependencies:
Error: Build failed with 2 errors:
node_modules/react-dom/cjs/react-dom.development.js:16:20: ERROR: [plugin: vite:dep-pre-bundle] Detected inconsistent metadata for the path "node_modules/react/index.js" when it was imported here:
node_modules/react/cjs/react-jsx-dev-runtime.development.js:16:20: ERROR: [plugin: vite:dep-pre-bundle] Detected inconsi    at failureErrorWithLog (D:\projects\web-projects\test\node_modules\esbuild\lib\main.js:1603:15)
    at D:\projects\web-projects\test\node_modules\esbuild\lib\main.js:1249:28
    at runOnEndCallbacks (D:\projects\web-projects\test\node_modules\esbuild\lib\main.js:1034:63)
    at buildResponseToResult (D:\projects\web-projects\test\node_modules\esbuild\lib\main.js:1247:7)
    at D:\projects\web-projects\test\node_modules\esbuild\lib\main.js:666:9
    at Socket.readFromStdout (D:\projects\web-projects\test\node_modules\esbuild\lib\main.js:632:7)
    at Socket.emit (events.js:321:20)
    at addChunk (_stream_readable.js:294:12)

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 https://github.com/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.

[houxd1992]

i have same error , why u close this issue ? how to fix it

[bluwy]

Duplicate of #7683

[JoaoDanielRamos]

Everyone is having this issue, waiting for a patch or something.

[songyu641660583]

我也遇到这个问题，请问怎么解决呢

[patak-dev]

For reference, esbuild 0.14.36 is out reverting the problematic change. Update esbuild in your projects and this is issue will be solved