Extracting messages into components folder

[RaphaelGimenez]

Hi, I'm running into an issue where I would like to extract my components messages individually.

We have a component library repo where we would like each component to own its translations files. It would present itself as the following structure:

• /component1
  • /lang
    • en.json
    • fr.json
    • es.json
  • index.js
• /component2
  • /lang
    • en.json
    • fr.json
    • es.json
  • index.js

Each component is then exported into its own package and when using them into another project we can use formatjs compile "node_modules/**/lang/en.json" --ast --out-file lang/en.json to create the final json file.

The problem is that using formatjs extract we can only output one big file instead of one file per folder.

I didn't find a solution in the doc neither in the discussions. Is there a way to do it easily ?

Here is what I'm thinking of doing:

finding all directories which have a lang subdir:
find ./src/components -type d -exec test -d '{}'/lang \;

executing a script to run fomatjs extract for the current path:
find ./src/components -type d -exec test -d '{}'/lang \; -exec npm run my-extract-script --path={} \;

[longlho]

yes I'd actually recommend you doing that. The CLI is meant to slot into more sophisticated workflow (e.g we use bazel so having simple parsing a folder into a file works and more complexity actually hurts)

[RaphaelGimenez]

Ok thanks for the fast reply :)

[alexabreu]

I'm also using formatjs to handle translation within a component library and am applying the technique above. However, many of our components import shared utility functions that make use of formatMessage via the imperative API. The utility function translations don't get properly extracted into the component's lang directory. Is there a recommended way to solve this issue? I came across this discussion: #3126 which seems related, but we're hoping to only require each component to load it's own translated strings rather than having to load all strings for the entire component library. Any recommendations would be greatly appreciated.