js-lingui: Cannot extract using i18n.plural : undefined is not iterable!

Hello, we use lingui v2.9.2 and we got issue extracting using i18n.plural:

This works:

export function _(
  id: MessageDescriptor | string,
  values?: Record<string, unknown>,
  messageOptions?: MessageOptions
): string {
  if (typeof id === 'string') {
    return i18n._(id, values, messageOptions)
  }
  return i18n._(id)
}

This fail:

export function _(id: MessageDescriptor | PluralProps): string {
  return !Object.prototype.hasOwnProperty.call(id, 'one')
    ? i18n._(id as MessageDescriptor)
    : i18n.plural(id as PluralProps)
}

It fails when we run lingui extract --clean, with the following error:

TypeError: src/libs/i18n.ts: undefined is not iterable!
    at module.exports.require.getIterator (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/babel-runtime/node_modules/core-js/library/modules/core.get-iterator.js:5:42)
    at Transformer.transformChoiceMethod (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/@lingui/babel-plugin-transform-js/transformer.js:199:56)
    at Transformer.transformMethod (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/@lingui/babel-plugin-transform-js/transformer.js:393:21)
    at PluginPass.Transformer.transform (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/@lingui/babel-plugin-transform-js/transformer.js:69:25)
    at newFn (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/babel-traverse/lib/visitors.js:276:21)
    at NodePath._call (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/babel-traverse/lib/path/context.js:76:18)
    at NodePath.call (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/babel-traverse/lib/path/context.js:48:17)
    at NodePath.visit (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/babel-traverse/lib/path/context.js:105:12)
    at TraversalContext.visitQueue (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/babel-traverse/lib/context.js:150:16)
    at TraversalContext.visitSingle (/home/dka/workspace/github.com/pass-culture/pass-culture-app-native/node_modules/babel-traverse/lib/context.js:108:19) {
  _babel: true
}

We rather use the synthax of i18n.plural instead of i18n._, how can this be fixed ?

Reproduction

git clone https://github.com/pass-culture/pass-culture-app-native.git
cd pass-culture-app-native
nvm use
yarn
yarn run translations:extract

Related issues

About this issue

  • Original URL
  • State: closed
  • Created 3 years ago
  • Comments: 74 (33 by maintainers)

Most upvoted comments

Quick update:

One thing we can’t fix without breaking others users, it’s not stripping spaces at the end of strings.

Not inmediately fix

For example this case:

<Text>{t`EAN\u00a0`}</Text>

Should be like this if you want that space, or " ":

<Text>{t`EAN`}{\u00a0}</Text>

A suggestion is to add a configuration property to lingui like trimTranslations: true/false, but i’ve need some time this weekend to develop this technique.

Inmediately fix

Pending for your side confirmation

  • When you can tell me if we fixed the unicode chars in Production.

Pending for my side

  • I’m going to check asap if I can resolve the warning about can’t use functions as child

Thanks, I was still working on my boilerplate, so I am giving up. I will try to see if there’s a way to start the application without those keys to see if we can investigate further.

Yes, that’s unfortunate, I am already on it.

OK so we have a bunch of other issues, I will list them here

Did you extracted and compiled other time?

We’re going to unlock this @kopax :shipit: I’ve just opened a pull request fixing the unicode part 👍🏻

Alright, thanks again for helping us in the migration process ! Good luck,

Let me review the unicode topic

Let me hotfix this 👍🏻 , try to patch the package and check if we need to change anything else:


var result = formatMessage(translation);
    return result && result.trim();

Already created the pr: #1030 , I’ll fix anything you find and i’ll release a new version in the same moment 😃

Here is the pull request @kopax https://github.com/pass-culture/pass-culture-app-native/pull/842 I couldn’t start the application because crashes my ios installation (i have some other applications an probably are colliding), so give it a try and tell me if everything works good 😃

Thanks @semoal that’s great, did you manage to use i18n.plural API? May I have a check on your branch?

Yes, just tried to use the <Plural /> macro and the plural() macro and both works nicely 😃

.tsx file somehwere there:

      <Plural value={0} one="# prueba" other="# pruebas" />
      {plural(0, {
        one: '# message',
        other: '# messages',
      })}

.po extracted:

#: src/features/bookings/components/BookingPropertiesSection.tsx:20
msgid "{0, plural, one {# message} other {# messages}}"
msgstr "{0, plural, one {# message} other {# messages}}"

#: src/features/bookings/components/BookingPropertiesSection.tsx:19
msgid "{0, plural, one {# prueba} other {# pruebas}}"
msgstr "{0, plural, one {# prueba} other {# pruebas}}"

I took a look and looks there’s no much to change and I’m sure that for the future will be easier for you, with all the power of Lingui with plurals, select and other cool methods.

(Of course will be a good real example how a migration to v3 can be done and useful for documenting or fixing any that is wrong on v3)

I’ll create a fork this weekend and probably in a few days I’ll create a pr! 👍🏻