My FeedDiscussionsHeadless CMS
New
Sign in
Log inSign up
Learn more about Hashnode Headless CMSHashnode Headless CMS
Collaborate seamlessly with Hashnode Headless CMSĀ for Enterprise.
Upgrade āœØLearn more

A little puzzle that I faced with ReasonML dev with Vim

Heechul Ryu's photo
Heechul Ryu
Ā·Apr 4, 2020

If you're doing something in a more specific way than usual, chances are the complexity of doing the same thing is greater than usual.

I believe many Reason developers face those challenges that keep having to dig to get helpful dev information since Reason is not super popular Javascript if you know what I mean šŸ˜‰.

I've coded with ReasonML (or Reason) a bit, back in 2018 and not much more after that. This is one of the results.

Recently I wanted to play with Reason again so it was natural to set up my editor, Vim to be ready for Reason dev first.

I've been using the same personal machine, a Mac since 2017 so why I haven't done this before? Back in 2018, my main code editor was VSCode and I heavily use Vim and rarely use VSCode these days.

So I visited the installation page to refresh Reason dev tools on my Mac by simply running

$ yarn global add bs-platform

in my terminal.

yarn global v1.22.4
[1/4] šŸ”  Resolving packages...
[2/4] šŸšš  Fetching packages...
[3/4] šŸ”—  Linking dependencies...
[4/4] šŸ”Ø  Building fresh packages...
success Installed "bs-platform@7.2.2" with binaries:
      - bsb
      - bsc
      - bsrefmt
      - bstracing
āœØ  Done in 2.88s.

After installation what I natually noticed something was having installed bsrefmt binary instead of refmt.

So I thought that's what's been changed and I convinced myself to use bsrefmt where requires using refmt, which worked fine. For instance, calling it directly from a command line to format Reason code or even in package.json like below:

// package.json

{
  ...
  "scripts": {
    ...
    "fmt": "bsrefmt --in-place 'src/**/*'"
  },
  ...
}

And that's when it all started with tricking myself to believe that the only difference of the two was just the name.

Now I've tested that bsrefmt works, I've wanted to set up my Vim to use (bs)refmt whenever I save Reason code.

So I started googling and I found bunch of tools and pages like below.

1. Editor Plugins

Where you can find the information for editor supports

2. vim-reason-plus

This is the official Vim plugin for Reason

This one provides syntax highlight, snippets for Reason and allows related features to recognize the Reason syntax.

Language-server provides all the others (autocompletion, type hint, jump-to-definition, etc.).

If you read further of the readme, then you will notice this plugin tells you to install "Language Server" and "Language Client" which respectively links to this and this.

3. ALE

"ALE (Asynchronous Lint Engine) is a plugin providing linting (syntax checking and semantic errors) in NeoVim 0.2.0+ and Vim 8 while you edit your text files, and acts as a Vim Language Server Protocol client."

4. vim-reasonml

This was for "native Reason". It's not what I was looking for since I'm trying to compile Reason to Javascript at the moment.

What is "native Reason" by the way?

It is for compiling Reason to (system) native binary instead of Javascript.


Now I got some bunch of tools and pages and to be honest, I still don't know much about "Language server" and stuff so it's not very easy to use something that I'm not very clear about. While I'm trying to integrate them into my Vim setup, something worked and something didn't. Especially auto refmt-ing to fix linting issue whenever I save Reason code.

So I googled more and found this super helpful article

Which allowed me to be confident of what I was doing so I continued setting up following this blog. And after that, still that one thing, refmt-ing when I save the file didn't work.

I believed ALE could do the job with these lines of setting:

"your vimrc

let g:ale_fixers = {
\  'reason': ['refmt'],
\}

so I tried changing that to

let g:ale_fixers = {
\  'reason': ['bsrefmt'],
\}

but it still didn't work. So I tried also different approaches like symlinking bsrefmt to refmt and still didn't work.

After many attempts of doing this right, It seems like whatever I do just doesn't work.

And like any struggles, I was approaching the point of giving up (at least for that day) but then suddenly I thought:

should I not rely on bsrefmt?

So I googled more and I found that there are also something called reason-cli

At the time of writing this post, the code in this repo is not been developed since 2 years ago and there is also not any single mentioning about this tool that I can find at reasonml.github.io. maybe it's being abandoned? I dont' know for sure.

So I installed it via $ yarn global add reason-cli which installs refmt binary too.

$ yarn global add reason-cli
yarn global v1.22.4
[1/4] šŸ”  Resolving packages...
[2/4] šŸšš  Fetching packages...
[3/4] šŸ”—  Linking dependencies...
[4/4] šŸ”Ø  Building fresh packages...
success Installed "reason-cli@3.3.3-macos-1" with binaries:
      - ocamlmerlin
      - ocamlmerlin-server
      - ocamlmerlin-reason
      - rtop
      - utop
      - refmt
      - refmttype
      - reactjs_jsx_ppx_v2
āœØ  Done in 3.25s.

And finally, it worked with ALE. šŸ˜… Now it auto formatting my Reason code when I save the file!

I'm sharing this experience for whoever might struggle with smiliar mental path as I took.

I also need to learn more about Language Server (Protocol) and related stuff because I'm interested to know how these useful tools actually work under the hood.

Let me do it now while I'm thinking about it. šŸ˜