vanjs-jsx fixes

[damienflament]

Fixes #325, #328 and other issues.

[Tao-VanJS]

@cqh963852, FYI

[thednp]

@damienflament does this fix also help with the Fragment error?

[damienflament]

@thednp No. I just started using Vite and JSX on my VanJS app. But I have some place where I put elements on a <div> to allow my component to return an array. I recently discovered in the React documentation about JSX that Fragments are made for that.

I read your ticket #324 about the missing Fragment implementation. I will take a look later.

[thednp]

@damienflament question: will the jsx runtime support custom VanJS components?

EG: function MyComp() { return div({}, 'some text')} with <MyComp /> syntax?

[damienflament]

@thednp Actually, that's how I use it.

MyComp() {
  return <div>Some text</>
}

<MyComp />
// transformed by the parser to:
jsx(MyComp)

In vanjs-jsx, jsx() is aliased to createElement().

Because MyComp is your custom function, it is called with properties as parameters.

But this function is also transformed by the parser:

MyComp() {
  return jsx("div", {children: "Some text"})
}

Now, createElement() is called with a tag name. The tag is created using van.tags as usual.

[thednp]

Thank you @damienflament for the explanation, how's the fix coming in? When can we test?

[cqh963852]

This can be fixed by adjusting the configuration of package.json.

[cqh963852]

Adding this file may cause the vscode editor's smart import to carry a special path.

For example

import {} from "van_jsx/jsx_runtime";