
Generating the JSON translation filesįor this part we create a custom PHP script which takes the finished translation from the. Enter your translations, hit save, and you’re good to go. po files will fill with translations within TypeScript.

Now you may click the “Update from code” button like normal and your. Command -> “xgettext -L JavaScript –add-comments=translators: –force-po -o %o %C %K %F”.TypeScript support may be added using the following: Out of the box, Poedit does not support TypeScript extensions. Since we are already using Poedit as part of the translation process, it was a no brainer to also use Poedit to generate the. The JSON files must contain only translations located within TypeScript files and not PHP required translations.The JSON files must be one file per language, not one file per source file.
Poedit source extensions install#
The generation of the finished JSON files must be able to run without a WordPress install available.The generation of the finished JSON files must be able to be run during Continuous Delivery.ts (although TSX would be more prominent). The system must pull translations out of TypeScript source files.We prefer to keep our translation process away from our Webpack build process as the translation system is intended to be independent.Our Webpack compiler will obfuscate the finished JS to the point that the WP-CLI tools do not pick up the calls correctly.This was not reasonable for us for the following reasons: There are some suggested workarounds to compile your application first then run the WP-CLI commands against it. The maintainers of the WP-CLI command are not working on a solution because of an underlying dependency limitation. A WordPress install must be available which adds complexity to Continuous Delivery.Īs you know, if you are reading this, using a modern Webpack based application with TypeScript does not fit into those assumptions.Each JS file is a single file per block and should therefore have a separate translation file per JS file.The available tools provided from WP-CLI for translating have the following assumptions: The Block Editor handbook has what you need. The available tools work great if you are using plain JavaScript and no form of Continuous Delivery (CI/CD) in your workflow. Translation calls are done during translation generation not during page load which improves performance.Translations need only be loaded when the site is in a language you have translations for instead of loading for every language.

You add your text in the React components where it is used so you don’t have to map objects to strings.Translating in JavaScript has some nice benefits: With the release of WordPress 5.0, support was introduced to allow developers to translate their theme or plugin directly within JavaScript. While this system works great it has some limitations. WordPress versions 4.9 and below allowed you to translate text in your JavaScript by passing JSON objects via wp_localize_script.
