[Feedback] Preserve JSX mode

,
1

Hello,

During the ReScript Retreat, we achieved an initial (rough) version of preserving JSX code in the JavaScript output. This is not the final version we plan to ship in v12, and we welcome your feedback to determine its viability and identify any remaining gaps.

Installation

You will need the latest v12 version from the master branch of the compiler. Install it via the pkg.pr URL:

npm i https://pkg.pr.new/rescript-lang/rescript@362a1da

In your rescript.json:

{
  "suffix": ".res.jsx",
  "jsx": {
    "version": 4
  },
  "bsc-flags": [
    "-bs-jsx-preserve"
  ]
}

The suffix is optional; you can choose to use the .jsx extension or not based on your use case. The -bs-jsx-preserve flag will likely be moved to a dedicated setting under the jsx node.
:warning: You need both jsx.version: 4 and -bs-jsx-preserve.

Known Limitations and Open Questions

We are aware of several limitations, and depending on your feedback, we will address them:

  • The JSX output is not formatted neatly. Props are displayed on the same line, and children are not indented.
  • Currently, all files share the same extension. Changing to .jsx might seem unusual if your file doesn’t contain any React components. In large projects, this may be mitigated by using preserve mode only for specific packages in the mono repo.
  • There may still be some edge-case bugs in the JSX output; please report any you encounter!

React Compiler

I tried this in my own project and can confirm that the React compiler worked as expected.

Solid

This new feature should enable the use of Solid. We haven’t tested this yet, so we would welcome a community sample!

7 Likes
2

@Fattafatta will like this

1 Like
3

I can’t wait to test this out when I get home from Vienna!

4

Nice :slight_smile: looking forward to hear more about the retreat.

  • Currently, all files share the same extension. Changing to .jsx might seem unusual if your file doesn’t contain any React components. In large projects, this may be mitigated by using preserve mode only for specific packages in the mono repo.

Have you considered a new file extension like *.resx?
So in your example it could compile *.res files to *.res.js and *.resx files to *.res.jsx. resx files will preserve jsx mode and res files wouldn’t.

2 Likes
5

That is an interesting idea! No, I didn’t think of that yet.

2 Likes
6

Similar one, but not for modules

7

This looks really promising. I will do some testing with solidjs.

5 Likes