20

I'm quite experienced with ReactJS and now I'm trying to learn ReasonML. But one thing that I've been struggling to understand, is how to import npm packages with React/Reason.

The instructions on the website are kinda unclear to me (https://reasonml.github.io/guide/javascript/interop/).

So, if I have a React/Reason project and want to use a npm package, how do I do it? How do I import it, using Reason lang?

glennsl
  • 28,186
  • 12
  • 57
  • 75
KadoBOT
  • 2,944
  • 4
  • 16
  • 34

1 Answers1

26

First off, thanks for the feedback! I'll make sure to get this improved.

Now, to be able to use a javascript library published on npm, you'll need to either find or make some bindings for it, as a bridge between Reason/BuckleScript and JavaScript. Ideally, the bindings you need have already been written (or generated) and published to npm, but in case it hasn't you'll have to write them yourself.

Most readily available bindings are listed in redex, the package index, and will include instructions on how to use it. But if they don't, all you need to do is run npm install --save <package-name>, as usual, then add the package name to the bs-dependencies array in bsconfig.json (see also the BuckleScript manual). Make sure to run bsb -make-world to get the new dependency built, then you should be able to use the modules exported by the bindings directly.

If there are no bindings, and you want to make your own, all you need to do is add the javascript package as normal using npm install --save <pacakge-name>, then just start writing externals. How to do so is described in the BuckleScript manual. You may also find my FFI cheatsheet useful.

Lastly, you're welcome to join us on our Discord where there's lots of friendly people eager to help!

glennsl
  • 28,186
  • 12
  • 57
  • 75
  • 1
    Need to add one more explicit step between adding the package to `bs-dependencies` and using: `bsb -make-world`. – Yawar Sep 02 '17 at 14:34
  • FFI is a term that I've only heard when referencing ReasonML. It may well be an OCaml thing too, but I've never heard of it in any of Java, C#, JavaScript, Haskell or LISP. So how come I've repeatedly seen that Reason developers refer to FFI as if everyone knows what it means? You can search for it https://reasonml.github.io/docs/en/external#docsNav but I think it would be clearer at least in SO answers if we used more general terms. – icc97 Nov 15 '18 at 21:06
  • 2
    @icc97 What terms would you suggest? FFI is about [as general as it gets for this concept](https://en.wikipedia.org/wiki/Foreign_function_interface) I think. "Native Bindings" or "JavaScript interop" might be more intuitive, but these terms are actually more _specific_ not more _general_. – glennsl Nov 16 '18 at 14:58
  • Being as general/abstract as possible isn't really the problem as I see. It's using common terminology. As per [c2.com](http://wiki.c2.com/?ForeignFunctionInterface): *The term comes from CommonLisp; though it's applicable to any such interface. Other language communities don't use the term FFI as much*. I'd suggest that 'interop' is a more common term, for example this [Reason blog](https://medium.com/@davidgomes/exploring-bucklescripts-interop-with-javascript-in-reason-a00ad3e6d81b) has 'interop' in the title and then uses the full 'Foreign Function Interface' when talking about FFI. – icc97 Nov 16 '18 at 18:09
  • I guess the main reason that I've never heard of it is that I've never had to call any C/C++ code from another language which seems to be the most common FFI. Even when I've seen examples there though, I don't remember FFI, for example in this [question on calling C from C#](https://stackoverflow.com/questions/11425202/is-it-possible-to-call-a-c-function-from-c-net) there's no mention in the question or answers about FFI. – icc97 Nov 16 '18 at 18:15
  • The only thing that sticks in my memory is the use of the `extern` keyword. "Calling external routines from Bucklescript" also seems a relatively understandable way of describing the same thing with hopefully not too much loss in specificity. – icc97 Nov 16 '18 at 18:22