Sorry, I don’t know how I can set the necessary compiler flags in the playground.
But I just tried to build a simplified example and something strange happend.
I have this simple component:
@jsx.component
let make = () => {
<div className="text"></div>
}
When using these settings in my rescript.json:
{
"bsc-flags": [ "-bs-jsx-preserve" ],
"jsx": {
"version": 4,
"module": "MyOwnJsx"
}
}
it actually works and the component gets compiled as expected.
function Btn(props) {
return <div className={"text"}/>;
}
But when I change the code in my MyOwnJsx.res:
module Elements = {
type props = JsxDOM.domProps
@module("myownjsx")
external jsx: (string, props) => Jsx.element = "jsx"
and remove the @module("myownjsx") part:
module Elements = {
type props = JsxDOM.domProps
external jsx: (string, props) => Jsx.element = "jsx"
the code will be compiled to:
function Btn(props) {
return jsx("div", {
className: "text"
});
}
So I think the solution would be to simply provide the dummy @module entry. But the bahaviour was a bit surprising for me.