test tested with jest styled with prettier MIT License All Contributors
This package will generate json or yaml files from a glob. It will generate one file per locale, with the ids of each message defined by the defineMessages function of react-intl. The value of each of these keys will be an empty string, except for your defaultLocale which will be populated with the defaultMessage.
- 0.x works with Babel 6
$ npm install --save-dev extract-react-intl-messages
app/components/App/messages.js
import { defineMessages, useIntl } from 'react-intl' export default defineMessages({ hello: { id: 'a.hello', defaultMessage: 'hello' }, world: { id: 'a.world', defaultMessage: 'world' } }) export const SubmitButton = () => { const intl = useIntl() const label = intl.formatMessage({ id: 'a.submit', defaultMessage: 'Submit Button' }) return <button aria-label={label}>{label}</button> }
$ extract-messages -l=en,ja -o app/translations -d en --flat false './app/**/!(*.test).js'
app/translations/en.json
{
"a": {
"hello": "hello",
"world": "world",
"submit": "Submit Button"
}
}app/translations/ja.json
{
"a": {
"hello": "",
"world": "",
"submit": ""
}
}Use with babel-plugin-react-intl-auto: i18n for the component age. Auto management react-intl ID.
$ extract-messages --help Extract react-intl messages Usage $ extract-react-intl-messages <input> $ extract-messages <input> Options -o, --output Output directory [require: true] -l, --locales locales [require: true] -f, --format json | yaml [default: json] -d, --defaultLocale default locale --overwriteDefault default: true --flat json [default: true] | yaml [default: false] --indent default: 2 Example $ extract-messages --locales=ja,en --output app/translations 'app/**/*.js' $ extract-messages -l=ja,en -o i18n 'src/**/*.js' $ extract-messages -l=ja,en -o app/translations -f yaml 'app/**/messages.js'
create .babelrc like this.
{
"presets": ["react-app"]
}Run with NODE_ENV=development.
$ NODE_ENV=development extract-messages ...
babel required.
npm install --save-dev @babel/core @babel/preset-typescript @babel/preset-react
babel.config.js
module.exports = function (api) { api.cache(true) return { presets: ['@babel/preset-react', '@babel/preset-typescript'] } }
Type: Array<string>
Example: ['en', 'ja']
Type: Array<string>
Target files. glob.
Type: string
Export directory.
Type: string
Default: en
Type: json | yaml
Default: json
Set extension to output.
Type: boolean
Default: true
If overwriteDefault is false, it will not overwrite messages in the default locale.
Type: number
Default: 2
Type: boolean
Default: true
If format is yaml, set to false.
Be careful if false.
See this issue.
See https://github.com/formatjs/formatjs/tree/master/packages/babel-plugin-react-intl#options
Thanks goes to these wonderful people (emoji key):
akameco
π»
Hoan Tran
π»
giantpinkwalrus
π» enrique-ramirez
enrique-ramirez
π Stefan Gojan
Stefan Gojan
π π»
Solomon English
π» Filip "Filson" Pasternak
Filip "Filson" Pasternak
π»
This project follows the all-contributors specification. Contributions of any kind welcome!
MIT Β© akameco