How do I correctly configure my own JSX module?

1

Hi,

so I have my rescript json like so:

{
  "name": "review_app",
  "sources": [
    {
      "dir": "src",
      "subdirs": true
    }
  ],
  "package-specs": [
    {
      "module": "es6",
      "in-source": true
    }
  ],
  "suffix": ".res.mjs",
  "bs-dependencies": [
    "@rescript/core"
  ],
  "bsc-flags": [
    "-open RescriptCore"
  ],
  "jsx": {
    "version": 4,
    "module": "Review"
  }
}

and my Review module (just copy/paste for now):

type element = Jsx.element
type component<'props> = Jsx.component<'props>
type componentLike<'props, 'return> = Jsx.componentLike<'props, 'return>

@module("review")
external jsx: (component<'props>, 'props) => element = "jsx"

@module("review")
external jsxKeyed: (component<'props>, 'props, ~key: string=?, @ignore unit) => element = "jsx"

@module("review")
external jsxs: (component<'props>, 'props) => element = "jsxs"

@module("review")
external jsxsKeyed: (component<'props>, 'props, ~key: string=?, @ignore unit) => element = "jsxs"

external array: array<element> => element = "%identity"
@val external null: element = "null"

external float: float => element = "%identity"
external int: int => element = "%identity"
external string: string => element = "%identity"

type fragmentProps = {children?: element}

@module("review") external jsxFragment: component<fragmentProps> = "Fragment"

module Review = {
  type props = JsxDOM.domProps

  @module("review")
  external jsx: (string, props) => Jsx.element = "jsx"

  @module("review")
  external div: (string, props) => Jsx.element = "jsx"

  @module("review")
  external jsxKeyed: (string, props, ~key: string=?, @ignore unit) => Jsx.element = "jsx"

  @module("review")
  external jsxs: (string, props) => Jsx.element = "jsxs"

  @module("review")
  external jsxsKeyed: (string, props, ~key: string=?, @ignore unit) => Jsx.element = "jsxs"

  external someElement: element => option<element> = "%identity"
}

but when I try to run the build I get:

Error: Unsupported jsx module Review 
For more details, please check out the schema at https://rescript-lang.org/docs/manual/latest/build-configuration-schema
>>>> Finish compiling 14 mseconds

Would anyone know where I made a mistake?

2

You need to use version 11.1.0-rc.2, then it should work.

It looks like you need to restructure your JSX module a bit too. Check out the docs: JSX | ReScript Language Manual

3 Likes