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>
};

[REASONML] Using Javascript npm package from REASON的更多相关文章

  1. Angular Npm Package.Json文件详解

    Angular7 Npm Package.Json文件详解   近期时间比较充裕,正好想了解下Angular Project相关内容.于是将Npm官网上关于Package.json的官方说明文档进行了 ...

  2. [WASM Rust] Create and Publish a NPM Package Containing Rust Generated WebAssembly using wasm-pack

    wasm-pack is a tool that seeks to be a one-stop shop for building and working with Rust generated We ...

  3. Node.js NPM Package.json

    章节 Node.js NPM 介绍 Node.js NPM 作用 Node.js NPM 包(Package) Node.js NPM 管理包 Node.js NPM Package.json Nod ...

  4. [Node.js] Configuring npm package.json scripts

    With a node package manager's (npm) package.json script property, you can preconfigure common tasks ...

  5. [NPM + React] Prepare a Custom React Hook to be Published as an npm Package

    Before we publish our package, we want to make sure everything is set up correctly. We’ll cover vers ...

  6. npm & package.json & directories & files

    npm & package.json & directories & files package.json https://docs.npmjs.com/files/packa ...

  7. npm package.json属性详解

    概述 本文档是自己看官方文档的理解+翻译,内容是package.json配置里边的属性含义.package.json必须是一个严格的json文件,而不仅仅是js里边的一个对象.其中很多属性可以通过np ...

  8. npm package.json配置整理

    通过npm init 创建 package.json文件 参数: name:项目名字 version: 版本号 description: 项目介绍 main: 项目的入口文件 scripts: npm ...

  9. 极简 Node.js 入门 - 1.4 NPM & package.json

    极简 Node.js 入门系列教程:https://www.yuque.com/sunluyong/node 本文更佳阅读体验:https://www.yuque.com/sunluyong/node ...

随机推荐

  1. [UVa11549]Calculator Conundrum

    题目大意:有一个只能显示n位数字的计算器,当溢出时只显示最高的n位. 输入k,要你不断平方,问你计算器显示的最大数是多少. 解题思路:这题的示数肯定会循环,那么我们关键就是找什么时候循环了. 可以用F ...

  2. 开源映射平台Mapzen加入了Linux基金会的项目

    2019年1月29日,Linux基金会宣布,开源映射平台Mapzen现在是Linux基金会项目的一部分. Mapzen专注于地图显示的核心组件,如搜索和导航.它为开发人员提供了易于访问的开放软件和数据 ...

  3. 关于FAT32分区的U盘4GB文件的测试

    关于FAT32分区的U盘4GB文件的测试 很多人都知道FAT32的分区,单文件大小不能超过4GB,关于这个问题就来测测看. FAT32最大文件大小为2的32次方,也就是4294967296 Byte, ...

  4. linux6 安装oracle11g

    转自:http://blog.csdn.net/nhm_lxy/article/details/37813789 安装环境:    虚拟机VMware Workstation 10.0 操作系统:   ...

  5. 关于Windows7下创建Cocos2D-X项目的小问题

    "新版的Cocos2D-X"已经不支持用上述脚本来创建工程了,而是改为用create-project.py来创建...命令格式: python create-project.py ...

  6. Objective-C学习笔记(十)——循环语句for和do-while的使用

    在OC中.除了while这样的循环方式外,还有另外for循环和do-while循环.它们在不同的业务逻辑下会有不同的作用.能够和C语言和Java对照着学习. (一)代码一: int main(int ...

  7. WordPress改动新用户注冊邮件内容--自己定义插件

    有些开放用户注冊功能的WordPress站点,可能有这么一项需求,就是用户注冊成功后,系统会分别给站点管理员和新用户发送一封通知邮件.给管理员发送的是新用户的username和Email,给刚刚注冊的 ...

  8. CloudFoundry 云平台部署

    CloudFoundry云平台部署 CloudFoundry(TheOpenSourceCloudOperatingSystem)距离发布已经一年多了作为第一个开源的PaaS平台日臻成熟.在这一年里C ...

  9. JS的解析与执行过程—全局预处理阶段之命名冲突的处理策略

    有如下代码: <body> <script> alert(f); function f() { console.log("fff"); } var f = ...

  10. 使用scatter画散点图

    刚开始接触Python,照着例子写的代码,百度注释的. from numpy import * import matplotlib import matplotlib.pyplot as plt im ...