jsx transform doesn't work

[easylogic]

We are building with the latest version.

The jsx syntax in the tsx file is expressed as it is without being built.

Is there no way?

// index.mjs

  const buttonContent = <span>{children || ""}</span>;

The expected expression is:

const buttonContent = React.createElement("span", null, children || "");

Both cjs and mjs are the same.

jsx syntax doesn't compile.

---

// tsconfig 

{
    compilerOptions: {
        jsx: "react"  // not working 
        jsx: "react-jsx" // compile with jsx function 
    }

}

[cometkim]

this has fixed in rc.12

[cometkim]

if you set jsx mode as preserve or react, you have to have import statement import * as React from 'react' at the top

[easylogic]

I will try it with rc.12.

[easylogic]

rc.12 is not exists in npmjs.

how to install this version?

[cometkim]

rc 12 is exist in @rc channel

try

npm uninstall nanobundle
npm install -D nanobundle@rc

[easylogic]

@cometkim

i installed rc.12

but It is still not working .

[cometkim]

Hmm let me take a look.

[cometkim]

I guess it is because of tree-shaking. Can you try again with actually exporting to your module tree?

[cometkim]

I see your Button component is compiling properly

[easylogic]

it is old version compile.

[easylogic]

I also found other error.
If you define "moduleResolution": "NodeNext", in tsconfig, the following error occurs.

TypeError: Cannot read properties of undefined (reading 'toLowerCase')
@react-elf/shared:build:     at result2tsconfig (file:///Users/user/github/test/react-elf/node_modules/tsconfck/dist/index.js:675:83)
@react-elf/shared:build:     at parseFile2 (file:///Users/user/github/test/react-elf/node_modules/tsconfck/dist/index.js:622:15)
@react-elf/shared:build:     at parseNative (file:///Users/user/github/test/react-elf/node_modules/tsconfck/dist/index.js:588:20)
@react-elf/shared:build:     at async it (file:///Users/user/github/test/react-elf/node_modules/nanobundle/bin.min.mjs:151:104)

[cometkim]

Yeah, it's caused by upstream 😅

I've already submitted PR to fix that dominikg/tsconfck#73

[cometkim]

it is old version compile.

So does it means you want to use the new jsxFactory (jsx()) from React 18?

[easylogic]

I want it to be built in the form of React.createElement function.

Existing esbuild worked like that.

This worked similarly to vite, so I thought I could use it as it is.

[cometkim]

Ah my fault, compiles are belong to dist I see

[cometkim]

I will publish it as rc.13 soon

[cometkim]

rc.13 is just published

[easylogic]

good.

i will test it .

[easylogic]

Oh it works fine.

The compilation result is good.

  const buttonContent = /* @__PURE__ */ React.createElement("span", null, children || "");