Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How handle "missing message" error in react-intl?

I'm using react-intl version 2.4.0 and for some translations I receive "missing message" error in console. Is there any way to handle them without upgrading to v3?

<IntlProvider
        locale="ru"
        messages={localeData.ru}
      >
        <Layout>
          <Component {...props} />
        </Layout>
      </IntlProvider>

enter image description here

like image 320
Yerlan Yeszhanov Avatar asked Dec 18 '19 08:12

Yerlan Yeszhanov


People also ask

What is IntlProvider in react?

IntlProvider​ React Intl uses the provider pattern to scope an i18n context to a tree of components. This allows configuration like the current locale and set of translated strings/messages to be provided at the root of a component tree and made available to the <Formatted*> components.

Why do we use react Intl?

As globalization increases, writing React applications for a wide-ranging audience in different regions and locales means making it accessible across languages. With internationalization capabilities, the React Intl library provides the mechanism to properly translate file text into other languages.


1 Answers

I had not read that issue on GH, but if you scroll to the bottom you'll see there is now an onError prop (as of v2.7.1) to provide a custom error handler.

   <IntlProvider onError={myCustomErrorFunction} />

Provide your own error handler (without a console.error) and the console error should go away.

like image 152
Brett DeWoody Avatar answered Oct 06 '22 00:10

Brett DeWoody