Movatterモバイル変換


[0]ホーム

URL:


Skip to content
DEV Community
Log in Create account

DEV Community

webbureaucrat
webbureaucrat

Posted on • Originally published atwebbureaucrat.gitlab.io on

     

How to Upgrade from BuckleScript to ReScript

I have a weakness: I have never seen an update I didn't want to adopt immediately. Betas? No thanks. Give me the nightly build. New major version of the Linux kernel? I'll just run the installation without stopping to grab my charger. So when BuckleScript announced a whole new language syntax (along with a rebrand to "ReScript"), I got excited and immediately wanted to transpile everything. This post will document the simple process step-by-step.

The need for the upgrade

To be honest, there isn't much of one. As the ReScript package maintainers have emphasized, the new compiler will not break code in the old syntax, as long as that old syntax is still in.re files.

I have as good a reason as any, though. I have a BuckleScript package calledbs-elm-es6, and I want new users who are unfamiliar with the old syntax to be able to read it, so I transpiled it to the new ReScript syntax and pushed it to a new package calledres-elm. I also have ademo website forbs-elm-es6 that functions as a project template and is also an important part of its documentation. I want to continue this template/documentations for users ofres-elm (like myself), so that's what I'm going to start with here.

Upgrading to the ReScript compiler

I'd like to leave the BuckleScript version for historical reasons just in case there are users who aren't ready to make the switch, so I forked the repository rather than push drastic changes to the old one. To make the page work in GitLab pages, I created a new group calledelmandrescript and created a new repository to match the domain,elmandrescript.gitlab.io Then I cloned that repository to my local workbench.

The next step, for me, is to navigate to my local BuckleScript repository and do a quick sanity check.

npm inpm run build
Enter fullscreen modeExit fullscreen mode

This should succeed, but it never hurts to make sure it does before you make changes.

Next, it's time to upgrade the compiler. For me, the easiest way to upgrade an npm package is just to uninstall and reinstall (without making any other changes in between.

npm r bs-platformnpm i bs-platform
Enter fullscreen modeExit fullscreen mode

This should upgrade you to the latest version. Note: as long as both commands succeeded, this is not a breaking change. You should make sure thatbs-platform is properly installed by running your build command once again.

npm run build
Enter fullscreen modeExit fullscreen mode

This should succeed, which is a good reminder: we don't have to migrate everything all at once. If we want, we can use the old compiler for _.re_files that use the old syntax.

Upgrading old BuckleScript code to ReScript Syntax

Thebsc -format command will translate our new code automatically. Run it on each of your scripts.

npx bsc-format src/Index.re> src/Index.res
Enter fullscreen modeExit fullscreen mode

If you build after this command usingnpm run build again, you will get a compiler error because you now have two modules that have the same name. It is safe to remove the old.re file.

rmsrc/Index.renpm run build
Enter fullscreen modeExit fullscreen mode

Now your project should build successfully.

Review the new.res file and revise

It's worth reviewing your new code and looking at the changes. In particular, the transpiler sometimes deletes whitespace that I prefer to have. (I'm a stickler for 80-character lines, which is a challenge in ReScript). It also deletes semicolons at the ends of lines because semicolons are optional in ReScript.

I like semicolons, and the emacsreason-mode still needs them to determine tab width, so I'm going to put at least some of them back.

I'm also going to splurge and update some other code dependencies. In particular, I want to take this opportunity to upgrade frombs-elm-es6 tores-elm for a consistently readable syntax throughout the codebase. (And mostly becauseres-elm is mine and I really need to test it!)

Enjoy the new ReScript syntax

If the above steps succeeded, you have now moved successfully from BuckleScript 7 to ReScript 8. I'll update this post with the new npm package location as soon as its available.

Top comments(1)

Subscribe
pic
Create template

Templates let you quickly answer FAQs or store snippets for re-use.

Dismiss
CollapseExpand
 
epsi profile image
E.R. Nurwijayadi
I am not a time traveller.
  • Location
    Jakarta
  • Work
    Mr. at Sunday Market
  • Joined

I wonder, what is the different between rescript and bucklescript 🤔?

And why does it have to be separated?

Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment'spermalink.

For further actions, you may consider blocking this person and/orreporting abuse

functional programming enthusiast and civic tech nerd.
  • Location
    Chicago, IL
  • Education
    Bachelor of Science, Computer Science, DePaul University
  • Work
    Software Developer
  • Joined

More fromwebbureaucrat

DEV Community

We're a place where coders share, stay up-to-date and grow their careers.

Log in Create account

[8]ページ先頭

©2009-2025 Movatter.jp