(I revised this answer mainly to let other readers and you know the issues I originally noticed in your steps as shown in the question.)
So in my original answer, I was focused on suggesting you to just go with the multiple script translation files, but I thought I should clarify the three things below:
It will find all the translations in the
src
directory in the multiplejs
files and will use that as the relative paths while thenpm run build
will make onebuild/index.js
file which I am enqueueing.
-
Yes,
wp i18n make-json
will create one JED-formatted JSON file per JavaScript source file — more details on Make WordPress. -
As with the
npm run build
(which uses thewp-scripts
package), it — as far as I know — only builds JavaScript source files (.js
) and not JED files which are JSON files. (There is a JS linter and other tools, though.)
The
wp i18n make-json
will create multiple files which the MD5 won’t work (probably because of the relative paths)
-
The files would work so long as you give the proper file name to your PO files where the format is
${domain}-${locale}.po
(see Plugin Handbook » Loading Text Domain) — e.g.my-plugin-it_IT.po
if the text domain ismy-plugin
and the locale is set toit_IT
(Italiano).But then, you used the wrong text domain, e.g. with the command
wp i18n make-pot ./ lang/myguten.pot
, you should’ve usedgbg
and notmyguten
because theText Domain
in your plugin header isgbg
(i.e.Text Domain: gbg
).Additionally, your
cp
(“copy”) command should have been preceded bycd lang
. -
As with the MD5 thing, it is the MD5 hash of the JS source file path as you can see in the PO file — so the path is (or should be) relative to the plugin folder.
E.g. Structure of my sample plugin:
wpse-366881/ build/ index.js <- relative path = build/index.js lang/ src/ edit.js <- relative path = src/edit.js index.js <- relative path = src/index.js index.php package.json
I rather have one combined JSON file.
So how should you internationalize JavaScript spread in multiple files but build in one?
Just follow the steps in the question, except:
-
Make sure the translation files (POT, PO, MO and JED/JSON) — i.e. the code inside and the file names — are using the text domain as defined in the plugin header. Additionally, put all the translation files in the correct directory.
E.g.
wp i18n make-pot ./ lang/gbg.pot
-
There’s no need to run the
wp i18n make-json
command which creates the multiple files, and just usepo2json
to create a single JED/JSON file from a PO file.And the command for that is: (Note that as of writing, WordPress uses JED 1.x)
npx po2json <path to PO file> <path to JSON file> -f jed1.x
E.g.
npx po2json lang/gbg-en_US.po lang/gbg-en_US-gbg-myguten-script.json -f jed1.x
Sample Plugin I used for testing purposes (and for other readers to try)
You can find it on GitHub — tried & tested working on WordPress 5.4.1, with the site locale/language set to it_IT
/Italiano. And the code are basically all based on your code, except in index.php
, I used the build/index.asset.php
file to automatically load dependencies and version.
And btw, the plugin was initially based on the example here.