Cannot get this to work

[folivieri]

Tried import: import { IntlProvider } from 'react-intl' import Cron from 'react-gnu-cron';

and

<IntlProvider messages="{cronMessages}" locale="en" defaultLocale="en">
<Cron onChange="{handleOnChange}" showResultText showResultCron /> </IntlProvider>

Browser complains:

[aepel]

Hi @folivieri Thanks for using this component. I wonder what have you used as cronMessages object. Because it is complaining about a missing id If you are not going to use a custom localization just remove the prop messages and it will use the default configuration like this

<IntlProvider locale="en" defaultLocale="en">    
     <Cron onChange="{handleOnChange}" showResultText showResultCron />
</IntlProvider>

I would recommend also to run storybook, yarn sb and there you are going to find the examples. Finally if you need a custom message dictionary take this as an example

https://github.com/aepel/react-gnu-cron/blob/master/src/component/Cron/components/cronMessages.js

Let me know if you will able to solve it.

[folivieri]

Thanks for the quick response. That did not help. nor did the suggestions by the browser : utils.js:76 Uncaught Error: [@formatjs/intl] Anid` must be provided to format a message. You can either:

1. Configure your build toolchain with babel-plugin-formatjs or @formatjs/ts-transformer OR
2. Configure your eslint config to include eslint-plugin-formatjs to autofix this issue`

[folivieri]

See example: in CodeSandbox: https://codesandbox.io/s/misty-cache-bnj0mx?file=/src/App.js

[folivieri]

https://codesandbox.io/embed/red-currying-ojezrm?fontsize=14&hidenavigation=1&theme=dark

[folivieri]

Any Thoughts?