2

my main problem which I am trying to solve is to generate JSON files from React source code.

currently I am using for translations react-intl universal package which is working in my App https://github.com/alibaba/react-intl-universal

To solve my main problem I have found this package (I have found only this one, so, if you recommend me something else, i will be glad)

https://github.com/GertjanReynaert/react-intl-translations-manager

As is in guide i have created translationRunner.js (which is in src folder)

const manageTranslations = require('react-intl-translations-manager').default;


    manageTranslations({
      messagesDirectory: 'src/translations/extractedMessages',
      translationsDirectory: 'src/translations/locales/',
      languages: ['nl'] // any language you need
    });

in my package.json added

"scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject",
    "manage:translations": "node ./translationRunner.js"

in render method i have something like

<h1>{intl.get('APPBARTITLE')}</h1>

if i run translationRunner.js I obtain nl.json which looks like

{
}

How to obtains json file with my message?

Bobek
  • 757
  • 3
  • 7
  • 15
  • Do you want the runner to generate `{ "APPBARTITLE": "" }` or what is the exact issue? – Chris Satchell Jul 23 '18 at 10:30
  • yes, i want to generate { "APPBARTITLE": "" } – Bobek Jul 23 '18 at 10:31
  • What does `src/translations/extractedMessages` contain? – Chris Satchell Jul 23 '18 at 10:38
  • subfolder locales and there is nl.json and whitelist_nl.json which has "[ ]" – Bobek Jul 23 '18 at 10:41
  • Does any file in any of those directories contain the localization key you are attempting to translate? – Chris Satchell Jul 23 '18 at 10:42
  • @ChrisSatchell no – Bobek Jul 23 '18 at 10:45
  • Check https://github.com/GertjanReynaert/react-intl-translations-manager/issues/64 – Chris Satchell Jul 23 '18 at 10:48
  • where should be babel config located? i have created ".babelrc" file in nodemodules/react-intl with "{ "presets": ["env", "stage-3"], "plugins": [ [ "react-intl", { "messagesDir": "src/translations/extractedMessages" } ] ] }" but doesnt help – Bobek Jul 23 '18 at 11:08
  • Have a look through all of the closed issues, there are a few that had the same issue. Sadly I haven't worked with this library before, so I can't really help you – Chris Satchell Jul 23 '18 at 11:11
  • [react-intl-universal-extract](https://github.com/alibaba/react-intl-universal/tree/master/packages/react-intl-universal-extract) could extract [react-intl-universal](https://fe-tool.com/react-intl-universal)'s default messages in source code to locale files. – cwtuan Dec 22 '22 at 07:19

1 Answers1

0

Apparently you need to run

npm run build 

first. The translation manager does not extract the keys you want translated, the babel plugin does.

https://github.com/GertjanReynaert/react-intl-translations-manager/issues/49

jgollenz
  • 21
  • 5