melange VS dune

Hey HN, at Ahrefs we have been working on an online book that hopefully helps React developers get up and running with Melange, an OCaml to JavaScript compiler. You can read more about Melange here: https://melange.re/.

There are still a few chapters that we'd like to add before considering it "complete", but it might be already helpful for some folks out there, that's why we decided to publish it early.

The book uses Reason syntax to implement React components using ReasonReact components. You can read more about both in:

https://reasonml.github.io/

In my previous post on trying to use the NextJS App Router and Reason I described some of the problems and limitations of their compatibility with one another. With the release of Melange 2 I decided to see if the new features of Melange 2 could help to increase the compatibility of Reason and the NextJS App Router. I have also documented some of the things learnt after trying Melange (v1) with Astro and Remix.

So it's Reason, not ReasonML which the umbrella project's name, and Rescript is a imcompatible syntax split from the Bucklescript team (that previously transpiled Reason to JS). Bucklescript's new name is... Rescript.

But not everyone agrees with the split and work is being done on Melange to replace Bucklescript : https://github.com/melange-re/melange

Ultimately JsOfOcaml can directly transpile Ocaml to JS.

In reality, most folks that developed BuckleScript frontends with ReasonML switched to ReScript syntax and are happy with it. Some felt more friction because of their reliance on PPXes or FP-heavy libraries (like Relude) and those people tend to use the Melange fork of BuckleScript or they switched to js_of_ocaml.

There is a fork of ReScript that supports ReasonML syntax and with the goal of maintaining Ocaml compatibility: https://github.com/melange-re/melange.

There's also a fork of BuckleScript/ReScript called Melange that guts its build system so that instead of using ninja, it works with more standard tools for the ecosystem, specifically dune and esy. In doing so they managed to also finally get the compiler off of OCaml 4.06: now it can use a newer OCaml compiler and take advantage of four years worth of language and compiler improvements.

For OCaml and ReasonML your options are js_of_ocaml (mentioned here in ReasonML docs) or a fairly new fork of BuckleScript called melange. They differ in implementation and output, with JSOO taking intermediate bytecode generated by ocamlc and turning it into unreadable JS, vs Melange being a patched compiler that builds more human-readable JS.

If you are using the dune build system, add the tag(s) to your dune-project file's package stanza. E.g.:

One way to get around this is to modify the api/dune file with (include_subdirs qualified); this means that every subdirectory of api/ can be referenced by module namespacing and we don't have to write dune files for every route (or pages) folder. However, the OCaml LSP does not like it and red squiggles will show up in the editor (although the app with still compile without errors). Trying to develop the app knowing those red squiggles cannot be vanquished would drive me nuts, so instead of using (include_subdirs qualified) I just wrote dune files for every route (and page) which gets rid of the red squiggles.

2) Neither would having all source/targets specified, as that would entail listing them all in the dune file as wildcard rules is apparently still not a thing: https://github.com/ocaml/dune/issues/307

There is a small example on the dune home page: https://dune.build/

Dune (https://dune.build/) is the preeminent build tool for OCaml development. I don't love its input syntax (s-expressions), and I sometimes miss the ability to write high-level functions to reduce boilerplate (especially for unit tests), but it always gets the dependencies right, and it's fast. This is in stark contrast to some of my experiences with various other build systems, and I am super happy that the default option for OCaml build systems is so good.

It's still weird because dune's own site only makes Jane Street references: https://dune.build/.

ONE of the big benefits of OCaml is its powerful REPL (also called the toplevel), the interactive command-line utility where you can load modules, type in and execute code, and see its results. The modern REPL, utop, has powerful auto-completion and integration with the build system dune, which enables productive workflows like loading an entire project's libraries in the REPL and interactively exploring them.