res-react-intl

Reason/OCaml PPX generating ReactIntl id (short MD5) from defaultMessage.

Example

Input:

// Demo.re
open ReactIntl;
 
module Msg = {
  [@intl.messages];
  let hello = {defaultMessage: "Hello"};
};
 
[@react.component]
let make = () => {
  <FormattedMessage defaultMessage="Some default message" />;
};

Output:

// Demo.bs.js
// Generated by BUCKLESCRIPT, PLEASE EDIT WITH CARE
'use strict'
 
var React = require('react')
var ReactIntl = require('react-intl')
 
var Msg = {
  hello: {
    id: '_8b1a9953',
    defaultMessage: 'Hello',
  },
}
 
function Demo(Props) {
  return React.createElement(ReactIntl.FormattedMessage, {
    id: '_0beb880a',
    defaultMessage: 'Some default message',
  })
}
 
var make = Demo
 
exports.Msg = Msg
exports.make = make

Installation

With yarn or npm on Bucklescript projects

Install the PPX with yarn or npm

yarn add res-react-intl bs-react-intl
# Or 
npm install res-react-intl bs-react-intl

And add the PPX in your bsconfig.json file:

{
  "bs-dependencies": ["bs-react-intl"],
  "ppx-flags": ["res-react-intl/ppx"]
}

Extract the messages:

res-react-intl-extract --allow-duplicates src

Developing

After cloning the repository, you should run both esy and yarn to install dependencies. res-react-intl uses esy for managing the important dependencies, and yarn is used solely for pre-commit linting/formatting of Reason files.

Relevant commands

• esy build -> Builds the project
• esy watch -> Watches for changes to Reason/OCaml files in the entire project, including in the /test directory
• esy test_native -> Runs the native tests (in test/native)
• esy test_bs -> Runs the BuckleScript tests (in test/bucklescript)

Releasing

1. Bump the version of the ppx in esy.json on master (we use semantic versioning)
2. Create and push a new tag

$ git checkout master
$ git tag vx.y.z
$ git push origin vx.y.z

1. Create detailed release notes for the new version, following the Added/Changed/Fixed/Removed format. Note that the new version of the PPX will automatically be pushed to NPM and a release will be created on GitHub.

Background/Sources

• Setup PPX Inspiration
• bs-react-intl-extractor