[REASONML] Using Javascript npm package from REASON

For example, we want to use moment.js inside our ReasonML code.

What we can do is create a module file:

//Moment.re

type tt;

external momentWithDate : Js.Date.t => tt = "moment" [@@bs.module];

external format : tt => string => string = "" [@@bs.send];

 

Using it inside component:

/* This is the basic component. */
let component = ReasonReact.statelessComponent "Page";

/* Your familiar handleClick from ReactJS. This mandatorily takes the payload,
   then the `self` record, which contains state (none here), `handle`, `reduce`
   and other utilities */
let handleClick _event _self => Js.log "clicked!";

let momentNow = Moment.momentWithDate(Js.Date.make());

/* `make` is the function that mandatorily takes `children` (if you want to use
   `JSX). `message` is a named argument, which simulates ReactJS props. Usage:

   `<Page message="hello" />`

   Which desugars to

   `ReasonReact.element (Page.make message::"hello" [||])` */
let make ::message ::times _children => {
  ...component,
  render: fun self =>
    <div onClick=(self.handle handleClick)> 
    (ReasonReact.stringToElement message) 
    (ReasonReact.stringToElement times) 
    (ReasonReact.stringToElement (Moment.format momentNow "dddd"))
    </div>
};