"jsx": "preserve" seems not working

[hardfist]

I try to use esbuild to transform my .tsxfiles to .jsx(just to strip type annotation), but it seems even though I pass {jsx:preseerve} to tsconfigRaw, it still transform jsx to createElement

    plugins: [
      {
        name: 'esbuild',
        setup(build) {
          build.onLoad({ filter: /\.tsx$/ }, async (args) => {
            const result = (await fs.readFile(args.path)).toString();
            const contents = await esbuild.transform(result, {
              loader: 'tsx',
              tsconfigRaw: `{
  "compilerOptions": {
    "jsx": "preserve"
  }
}`,
            });
            console.log('result:', result, contents);
            return {
              contents: contents.code,
              loader: 'jsx',
            };
          });
        },
      },
    ],

[evanw]

Only a few tsconfig.json parameters are loaded at the moment, and jsx is not one of them. There is no code in esbuild that is capable of generating JSX syntax so this is expected behavior.

Can you say more about your use case? What tool(s) are you using on your code after stripping types with esbuild?

[hardfist]

we use @babel/traverse to transform jsx to miniapp(something like vue), which relys on jsx ast type, and jsx is more easy to static analyze than react.createElement, so we want to keep the origin jsx structure

[Dkendal]

Just ran into this as well. At https://github.com/BuilderIO we have a project https://github.com/BuilderIO/jsx-lite that converts JSX to equivalent code for multiple front-end frameworks. I was hoping to use esbuild as a drop in replacement for tsc but to do that it has to output JSX as out tool chain currently relies on Babel transforms to arrive at the final output.

I'd be happy to assist with this if you can point me in the right direction.

[whaaaley]

Only a few tsconfig.json parameters are loaded at the moment, and jsx is not one of them. There is no code in esbuild that is capable of generating JSX syntax so this is expected behavior.

Can you say more about your use case? What tool(s) are you using on your code after stripping types with esbuild?

My use case for this is that I want to run JSX transformations all at once after esbuild ouputs a bundle. Ignoring JSX would be very nice to have. I'm using official TSC to take care of JSX since I'm already using it for compiling to es5 and it supports the new JSX transform.

I can probably whip up a plugin to use TSC in place of babel for JSX transform since it's already a dependency, but I'll be using TSC twice.