jsx preserve does not work

[DavidVollmers]

Describe the bug

I am trying to build a library containing tsx files to ouput jsx files. As I understand this is done by setting the jsx config in tsconfig.json to preserve. For some reason I cannot make this work and it will always output a js file using React.createElement.

Reproduction

https://github.com/DavidVollmers/vite-jsx-lib

Steps to reproduce

Run npm i and then nx build and look into the dist folder. It will contain only a lib/index.js files and no lib/index.jsx file. Also in the lib/index.js file you will see the following output generated:

const t = /* @__PURE__ */ React.createElement("button", null);
export {
  t as jsx
};

System Info

System:
    OS: Windows 10 10.0.19045
    CPU: (28) x64 13th Gen Intel(R) Core(TM) i7-13850HX
    Memory: 15.57 GB / 31.69 GB
  Binaries:
    Node: 20.16.0 - C:\Program Files\nodejs\node.EXE
    npm: 10.8.1 - C:\Program Files\nodejs\npm.CMD
  Browsers:
    Edge: Chromium (128.0.2739.63)
    Internet Explorer: 11.0.19041.4355

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 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.

[hi-ogawa]

Preserving jsx for build is likely not supported. For one, it looks like rollup requires a parser plugin to do that rollup/rollup#4431 but with some caveat. Even if that works on rollup, Vite's transform pipeline expects plain js (for example, es-module-lexer used during vite:build-import-analysis's transform), so jsx needs to be transpiled away earlier.

[DavidVollmers]

Any confirmation that this is not supported and maybe some hints on how to get around this? In theory I could produce the jsx files using tsc but this gets more complicated in larger mono repositories...

[hi-ogawa]

I tried to follow rollup/rollup#4431 but it turned out acornInjectPlugin option has been already removed in rollup 4 https://rollupjs.org/migration/#configuration-changes

This means, unfortunately, that you can no longer add plugins for unsupported syntax. Depending on demand, we consider supporting JSX syntax again as the SWC parser would support that.

(On Vite side, you could set esbuild.jsx: "preserve" and also patch out vite:build-import-analysis plugin, but rollup would be a final blocker.)

[DavidVollmers]

OK I see, thank you. At least setting esbuild.jsx: "preserve" did not do anything for me. I will try to come up with a workaround (probably by not using vite anymore 😢)...