Importing react/jsx-runtime breaks dev builds

Describe the bug

When importing react/jsx-runtime, dev build breaks with the following client error:

Uncaught ReferenceError: module is not defined
    at jsx-runtime.js:6

In my more complex setup I am consuming a local prebuilt library and get a more weird error message

Uncaught ReferenceError: module is not defined
    at null:6

I’ve found out that setting optimizeDeps.include: ['react/jsx-runtime'] fixes this issue and in fact 'react/jsx-dev-runtime' works because @vitejs/plugin-react adds it by default. Does it make sense to also include 'react/jsx-runtime' there?

Reproduction

StackBlitz

System Info

System:
    OS: macOS 12.0.1
    CPU: (12) x64 Intel(R) Core(TM) i7-8850H CPU @ 2.60GHz
    Memory: 69.96 MB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.13.0 - ~/.volta/tools/image/node/16.13.0/bin/node
    Yarn: 1.18.0 - ~/.volta/tools/image/yarn/1.18.0/bin/yarn
    npm: 8.1.0 - ~/.volta/tools/image/node/16.13.0/bin/npm
    Watchman: 2021.06.07.00 - /usr/local/bin/watchman
  Browsers:
    Chrome: 96.0.4664.110
    Edge: 96.0.1054.62
    Firefox: 95.0
    Safari: 15.1
  npmPackages:
    @vitejs/plugin-react: ~1.1.3 => 1.1.3 
    vite: ~2.7.4 => 2.7.4

Used Package Manager

npm

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

[ecarrera]

Change the configuration of your @vitejs/plugin-react instance to the classic mode of the jsxRuntime

vite.config.js

import react from '@vitejs/plugin-react';

export default defineConfig({
  plugins: [
    react({
      jsxRuntime: 'classic',
    }),
  ]
});

Reference

Opting out of the automatic JSX runtime

By default, the plugin uses the automatic JSX runtime. However, if you encounter any issues, you may opt out using the jsxRuntime option.

react({ jsxRuntime: ‘classic’ })

[arm1n]

For me this proposed solution works as a temporary hotfix:

resolve: {
  alias: {
    'react/jsx-runtime': 'react/jsx-runtime.js',
  },
},

Will your PR covers this issue @aleclarson? Thank you!