Skip to content
Use react-intl with PhraseApp In-Context Editor
TypeScript JavaScript
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Type Name Latest commit message Commit time
Failed to load latest commit information.
__tests__ -> Aug 5, 2019
helper fix test helper Apr 25, 2017
src -> Aug 5, 2019
.gitignore Remove dist dir Mar 28, 2018
.travis.yml Update Jest to fix tests Mar 27, 2018
LICENSE Add MIT license file Feb 15, 2018 Update Nov 12, 2018
package-lock.json Update to 0.4.1 Aug 6, 2019
package.json Update to 0.4.1 Aug 6, 2019
webpack.config.js Use babel-runtime instead of polyfills Mar 27, 2018


Build Status

react-intl-phraseapp is an addon for react-intl that lets you connect localized react applications to the PhraseApp In-Context Editor.


To use react-intl-phraseapp with your application you have to:


You can find a demo project on GitHub.


via NPM:

npm install react-intl-phraseapp

Build form source

You can also build it directly from source to get the latest and greatest:

npm run dist


npm install


let config = {
  projectId: '<YOUR_PROJECT_ID>',
  phraseEnabled: true,
  prefix: "[[__",
  suffix: "__]]",
  fullReparse: true

You can find the Project-ID in the Project overview in the PhraseApp Translation Center

JavaScript snippet

Add the following snippet to your react app.

import {initializePhraseAppEditor} from 'react-intl-phraseapp'

let config = {
  projectId: '<YOUR_PROJECT_ID>',
  phraseEnabled: true,
  prefix: "[[__",
  suffix: "__]]",
  fullReparse: true


If this does not work for you, you can also integrate the JavaScript snippet manually.

Import from react-intl-phrasapp rather than from react-intl

Find all imports of FormattedMessage, FormattedHTMLMessage and change the source from react-intl to react-intl-phrasapp.

import {FormattedMessage} from 'react-intl-phraseapp'

How does it work?

The library inherits common components of the react-intl packages. In case you enabled PhraseApp by calling initializePhraseAppEditor the behaviour of the components will be changed.


Question? Contact us at:

Issue? use GitHub issues and share the problem


Run unit tests using jest:

npm test
You can’t perform that action at this time.