All Projects → evenchange4 → react-intl-po

evenchange4 / react-intl-po

Licence: MIT license
🚀 Extract POT from react-intl and convert back to json.

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to react-intl-po

alda
A boilerplate for React isomorphic aplication with Material Design
Stars: ✭ 16 (-81.82%)
Mutual labels:  react-intl
react-intl-po-example
👉 This is a standalone project for using react-intl-po with CRA.
Stars: ✭ 38 (-56.82%)
Mutual labels:  react-intl
react-intl-cra
🔧 Extract messages of Creact React App from the command line.
Stars: ✭ 68 (-22.73%)
Mutual labels:  react-intl
react-intl.macro
Extract react-intl messages with babel-plugin-macros.
Stars: ✭ 39 (-55.68%)
Mutual labels:  react-intl
energy-use-case-trading-client
Energy Use Case Web UI for Lition Trading Platform
Stars: ✭ 23 (-73.86%)
Mutual labels:  react-intl
storybook-addon-intl
Addon to provide a locale switcher and react-intl for storybook
Stars: ✭ 84 (-4.55%)
Mutual labels:  react-intl
gatsby-typescript-emotion-storybook
Gatsby Starter: TypeScript + Emotion + Storybook + React Intl + SVGR + Jest
Stars: ✭ 63 (-28.41%)
Mutual labels:  react-intl
rescript-react-intl-extractor
Extracts messages for localization from ReScript source files.
Stars: ✭ 32 (-63.64%)
Mutual labels:  react-intl
extract-react-intl
Extract react-intl messages
Stars: ✭ 18 (-79.55%)
Mutual labels:  react-intl
react-template
An enterprise react template application showcasing - Testing strategy, Global state management, middleware support, a network layer, component library integration, localization, PWA support, route configuration, lazy loading and CI/CD
Stars: ✭ 44 (-50%)
Mutual labels:  react-intl
mobx-react-intl
A connector between mobx-react and react-intl
Stars: ✭ 32 (-63.64%)
Mutual labels:  react-intl
admin-template-for-react
🌏 Admin template for React, React Redux, Redux Saga, React Router, i18n and integrated OAuth login
Stars: ✭ 83 (-5.68%)
Mutual labels:  react-intl
i18n
Minimalist gettext style i18n for JavaScript
Stars: ✭ 14 (-84.09%)
Mutual labels:  react-intl
react-intl-demo
使用 react-intl 实现 React 国际化多语言
Stars: ✭ 30 (-65.91%)
Mutual labels:  react-intl
atticus-literature
Ititially, it's a bookstore website. However, I 'd like to develop something deeper then in the future.
Stars: ✭ 21 (-76.14%)
Mutual labels:  react-intl
react-native-boilerplate
🚀 A highly scalable, react-native boilerplate reinforced with react-boilerplate which focus on performance and best practices. 🔥. 💻 🚀 😎 👾 👽
Stars: ✭ 82 (-6.82%)
Mutual labels:  react-intl
generator-tsx
Yeoman generator for CRA + TypeScript + React + Redux + Router + Testing Library.
Stars: ✭ 25 (-71.59%)
Mutual labels:  react-intl
smashing-react-i18n
Internationalizing React App Boilerplate For SmashingMagazine
Stars: ✭ 63 (-28.41%)
Mutual labels:  react-intl
kotlin-js-wrappers
Kotlin JS wrappers for popular JavaScript libraries
Stars: ✭ 48 (-45.45%)
Mutual labels:  react-intl
egghead-bookshelf
An example React application to accompany the "Add Internationalization (i18n) to a React app using React Intl" Egghead.io course
Stars: ✭ 28 (-68.18%)
Mutual labels:  react-intl

react-intl-po

Extract POT from react-intl and convert back to json.

messages.json → POT → PO → translation.json

Travis Codecov Status npm package npm downloads

Dependency Status devDependency Status peerDependency Status

license prettier

Tutorial

Please take a look at standalone repo based on Create-React-App: https://github.com/evenchange4/react-intl-po-example

Installation

$ yarn add react-intl-po

Requirements and Workflow

RIP Workflow

Usage

There are two sub-commands of react-intl-po or rip:

  1. json2pot: Convert the json files extracted from babel-plugin-react-intl into one .pot file.
  2. po2json: Convert translated .po files back to .json format.

json2pot

$ rip json2pot '_translations/src/**/*.json' \
    -o ./mcs-public.pot
Arguments Description
srcPatterns The pattern of .json files extracted from babel-plugin-react-intl
-o, --output <path> The output pathname of .pot file to be translated
-k, --message-key [key] [Optional] Translation message key (default key is defaultMessage)
-c, --message-context [context] [Optional] Translation message context (defaults to no context)

po2json

Case 1: Output one file per locale if a directory is set

$ rip po2json './node_modules/mcs-translation/po/mcs-public*.po' \
     -m './_translations/src/**/*.json' \
     -o './translations'

Case 2: Output one merged file if a .json file is set

$ rip po2json './node_modules/mcs-translation/po/mcs-public*.po' \`
     -m './_translations/src/**/*.json' \
     -o './translations.json'
Arguments Description
srcPatterns The pattern of translated .po files
-m, --messages-pattern <path> The pattern of .json files extracted from babel-plugin-react-intl
-o, --output <path> The output pathname of a file / directory
-k, --message-key [key] [Optional] Translation message key (default key is defaultMessage)
-c, --message-context [context] [Optional] Translation message context (defaults to no context)
-l, --lang-mapper-pattern <pattern> [Optional] Custom regex to use for lang mapping. PR#122
-i, --lang-mapper-pattern-index [index] [Optional] When specifying a custom lang-mapper-pattern, the index of match to use for the lang mapping. Default is 1, index is ignored if not using a custom lang mapping regex. PR#122
--indentation <number|char> [Optional] Specify a number of spaces or a set of characters to be used before each entry of the resulting json file. Defaults to null, which means the entries are not prefixed with spaces.
--sort-by-id [Optional] If specified, the entries of each language are sorted by id before being output

Property

Q&A

How to translate the same message into two different meanings?

Option 1 (Recommended):

Set the message-context (-c) to 'id' of message object from babel-plugin-react-intl (there is no context by default).

The advantage of this option over Option 2 (below) is that PO file editors that provide features such as translation suggestions or error-checking often expect the message key to be defaultMessage.

$ rip po2json './node_modules/mcs-translation/po/mcs-public*.po' \
     -m './_translations/src/**/*.json' \
     -o './translations' \
     -c 'id'

$ rip po2json './node_modules/mcs-translation/po/mcs-public*.po' \`
    -m './_translations/src/**/*.json' \
    -o './translations.json' \
    -c 'id'

Example: https://github.com/evenchange4/react-intl-po-example#option

Option 2: [Maybe deprecated next major release]

Set the message-key (-k) to 'id' of message object from babel-plugin-react-intl (default key is 'defaultMessage'). (#41)

$ rip po2json './node_modules/mcs-translation/po/mcs-public*.po' \
     -m './_translations/src/**/*.json' \
     -o './translations' \
     -k 'id'

$ rip po2json './node_modules/mcs-translation/po/mcs-public*.po' \`
    -m './_translations/src/**/*.json' \
    -o './translations.json' \
    -k 'id'

Development

$ yarn install --pure-lockfile

Ramda.js

You can use R.tap() for developing.

R.pipe(
  R.concat(...),
+ R.tap(e => console.log(e)),
  R.mergeAll,
);

Requirements

  • node >= 9.11.1
  • yarn >= 1.5.1

Test

$ yarn run format
$ yarn run eslint
$ yarn run test:watch

NPM Release

Any git tags.

  1. Create a new git tag
  2. Update CHANGELOG.md
$ npm version patch

CONTRIBUTING

  • ⇄ Pull requests and ★ Stars are always welcome.
  • For bugs and feature requests, please create an issue.
  • Pull requests must be accompanied by passing automated tests ($ yarn run test).

CHANGELOG

LICENSE

MIT: http://michaelhsu.mit-license.org

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].