Cannot read property 'indexOf' of undefined at RelativeTime.setup, key is undefined (WEBPACK)

[Wojciech Frącz]

I'm submitting a bug report

• Library Version:
  1.6.2

Please tell us about your environment:
Webpack 3.5.6, aurelia-webpack-plugin: 2.0.0-rc5

• Browser:
  all

• Language:
  TypeScript 2.4.1

Current behavior:
I'm trying to migrate an existing JSPM-based Aurelia app to webpack and I can't get rid of the following error from JS console in Chrome:

Unhandled rejection TypeError: Cannot read property 'indexOf' of undefined
    at RelativeTime.setup (webpack-internal:///152:38:21)
    at eval (webpack-internal:///152:25:13)

or in Firefox:

Unhandled rejection TypeError: key is undefined
    setup@webpack-internal:///152:38:1
    RelativeTime/<@webpack-internal:///152:25:7

The error comes from this line.

I am using i18next-xhr-backend as suggested in #221 and my translations are loaded correctly. However, immediately after the translations are loaded, the above error shows up in the console.

It's really hard to reproduce this outside my app so I'm hoping for a clue what I might have misconfigured.

The configuration of i18n is as follows:

import * as I18nBackend from "i18next-xhr-backend";
import {I18N, TCustomAttribute} from "aurelia-i18n";
// ...
.plugin('aurelia-i18n', (instance) => {
        const aliases = ['t'];
        TCustomAttribute.configureAliases(aliases);
        instance.i18next.use(I18nBackend );
        return instance.setup({
          backend: {
            loadPath: '/res/locales/{{lng}}/{{lng}}_{{ns}}.json',
          },
          preload: ['de', 'en'],
          fallbackLng: ['en'],
          ns: ['generic', 'validation', 'nav'],
          defaultNS: 'generic',
          attributes: aliases,
          nsSeparator: '::',
          keySeparator: '//',
          interpolation: {
            capitalized: str => str.charAt(0).toUpperCase() + str.slice(1)
          },
          debug: true
        });
      });

[Vildan Softic]

Please try adding the lng property to your plugin options to define the default locale. That might help

[Wojciech Frącz]

It helped, indeed. I have set lng: 'en'. Thank you!

[Vildan Softic]

Actually we should expose a better error message if the default language is not provided, so I'll leave this one open until it's fixed. Glad it helped though.

[Damien C.]

I'm having an issue with the commit provided in here. Forcing to set the lng option breaks the i18next-browser-languagedetector plugin (and probably other i18next language detection plugins) as per their documentation : see https://www.i18next.com/configuration-options.html where it is said that setting lng option overrides language detection. Can't there be a better solution than the one provided ?

[Chenfu Wang]

Had the same problem. So it seems it is not possible to verify the 18n feature:

1. change chrome language setting to a language other than en, e.g. de
2. refresh the app, the tranlsation is still in 'en'.

Then deleting lng: 'en' will result in this problem.

[Jule-]

@chabou-san same here!

Maybe a better solution should be to enforce a fallbackLng and use it for relative-time when lng is missing!

It is a blocking issue for browser language detection, which I guess everyone who wants to internationalize its app wants too...