updating config after usin Lingui

[Ahmed-Elbessfy]

Hi,
I am preparing for a talk about Internationalization and I noticed that If I started the project and done some translation, then I try to edit "format" & "catalog" configuration, it does not work.
For format, I am using the "format-json" and started the project with the following:

format: formatter({ style: "lingui" }),

but when I changed the style to "minimal" as here:

format: formatter({ style: "minimal" }),

I got empty messages, just IDs, even when I ran "yarn lingui extract".

As per catalogs, here is the original config I started with:

format: formatter({ style: "lingui" }),
////
 catalogs: [
    {
      path: "<rootDir>/src/locales/{locale}/messages",
      include: ["src"],
    }
  ],

But when I tried this:

 catalogs: [
    {
      path: "<rootDir>/src/locales/{locale}/messages",
      include: ["src"],
    },
    {
      path: "<rootDir>/src/locales/{locale}/{name}",
      include: ["components/{name}/"],
    },
  ],

I am not sure if it's the update or my syntax. I tried the one in this docs: here

Also, in case using this way, here, how to load catalogs content into components? is it with wrapping each component with I18nProvider and loading message in the Component files?

I know it is a bit of too much but I am trying to learn more and teach the best version.
Thanks for help.

[timofei-iatsenko]

Make sure you have sourceLocale defined in your lingui config.

Actually, i don't recommend using any of the JSON formats. It only seems easier in the beginning, because you're familiar with the JSON files, but then you quickly will go into troubles.

There are no benefits of using json format over PO with lingui:

1. You still need to compile it first, the same as PO, because compilation is actually transforming the messages itself, processing the ICU expressions, so you don't have to bring the compiler code into the production bundle.
2. The JSON is a simply a key-value, in case of lingui you have 3 properties, key (generated short id), source message and translation. How that should be fit into the minimal format with only key and value?

Anyway, if you still want to process with JSON, what you should know:

Say you have

{
  locales: ['en', 'ru', 'fr']
  sourceLocale: 'en',
}

On extract command, Lingui will generate, 3 files:

en.json would be pre-populated with original messages from source code
ru.json will have only keys, values would be empty
fr.json will have only keys, values would be empty

When you compile the catalogs with lingui cli, or use one of the bundler plugins/loaders (vite or webpack) the keys which do not have a translation in the ru or fr locales would be automatically fell back to the source messages from en.

Also, in case using this way, here, how to load catalogs content into components? is it with wrapping each component with I18nProvider and loading message in the Component files?

Honestly, i never ever have a need to use this flow, so I don't know how to help there. I'm personally always preparing one catalog per entry point or per app and load it once.

[Ahmed-Elbessfy]

Hi,
First, I want to apologize for my late response. I had a very bad coronavirus infection and needed time to recover.
Second, Thank you for the detailed response, I learned new details about how it works.
Third, maybe I was not clear but what I meant was that If I altered the format, I wouldn't get the current translation I already added. It is not about using JSON or PO formats.
Finally, regarding separating content, I personally did not use it either but it is a feature that I think is good for anyone who needs to organise his/her translation content so I wanted to know how to implement it.