Issues with react-intl causing production build to failing

[shanejones]

Hi

I'm having an issue with this plugin whereby it's giving me errors when it runs gatsby build on the production server. Weirdly though, when I run gatsby build locally it works perfectly.

The issue comes in the build logs on Netlify and the main error block is

2:45:06 PM: error Building static HTML failed for path "/no/capabilities/content-marketing/" 
2:45:06 PM: 36 | } 
2:45:06 PM: 37 | } catch (e) { 
2:45:06 PM: > 38 | throw new Error("Cannot find react-intl/locale-data/" + language); 
2:45:06 PM: | ^ 
2:45:06 PM: 39 | } 
2:45:06 PM: 40 | }; 
2:45:06 PM: 41 | 
2:45:06 PM: 
2:45:06 PM: WebpackError: Cannot find react-intl/locale-data/no
2:45:06 PM: 

From doing some digging around I tried relocating my translation JSON files to this folder structure that react-intl is looking for but that gave me the same results, working fine on Local build but not on a production build.

Is this a known bug and would you be able to point me in the right direction on this one?

Thanks

[novelnet]

Following up, i have the exact same issue. Works fine on local gatsby build but fails at netlify build.

    {
      resolve: `gatsby-plugin-intl`,
      options: {
        // language JSON resource path
        path: `${__dirname}/src/intl`,
        // supported language
        languages: [`de`, `ch`, `at`],
        // language file path
        defaultLanguage: `de`,
        // option to redirect to `/de` when connecting `/`
        redirect: true,
      },
    },

and that's the error output:

11:51:20 PM: error Building static HTML failed for path "/ch/404.html"
11:51:20 PM: 
11:51:20 PM: 
11:51:20 PM:   36 |     }
11:51:20 PM:   37 |   } catch (e) {
11:51:20 PM: > 38 |     throw new Error("Cannot find react-intl/locale-data/" + language);
11:51:20 PM:      |           ^
11:51:20 PM:   39 |   }
11:51:20 PM:   40 | };
11:51:20 PM:   41 | 
11:51:20 PM: 
11:51:20 PM:   WebpackError: Cannot find react-intl/locale-data/ch
11:51:20 PM:   
11:51:20 PM:   - wrap-page.js:38 polyfillIntl
11:51:20 PM:     node_modules/gatsby-plugin-intl/wrap-page.js:38:11

Edit: In my case it just seems like the locale 'ch' (swiss german) is missing in format.js (@formatjs/intl-pluralrules/dist/locale-data/${locale}). Removing the locale works, but it's strange why it's not failing in locale build anyway.

@shanejones: You're locale 'no' is missing as well.

I'll try this kind of locale de-ch as workaround tomorrow. Would be nice to have some "custom locale" support possible.

[shanejones]

Hey @novelnet

I have no in my config as you can see below.

    {
      resolve: `gatsby-plugin-intl`,
      options: {
        path: `${__dirname}/src/lang`,
        languages: [`en`, `no`],
        defaultLanguage: `en`,
        redirect: false,
      },
    },

Was that what you meant? Will have a look at @formatjs/intl-pluralrules/dist/locale-data/ and see what we have there

[olekern]

If it is 'no' as in Norwegian, it can be solved by changing from 'no' to 'nb'.

[shanejones]

This seems to do something now but it creates new issues.

Is there any reason why the plugin allows the /no/ code?

Looking into info on ISO Codes on Wiki

/no/ is an inclusive code with /nb/ and /nn/ being individual codes. In theory /no/ shoudl work too id the others do.

[novelnet]

I also tried to use /de-ch instead of /ch and got issues like switching randomly between /de and /de-ch or some pages are white. I'm also trying to replace the locale file path of "custom locale" with an alias in webpack, without success yet.

What i still dont understand is why the same build command fails on server but not not locale. Maybe the throw error if module can not be solved is somehow muted in wrap-page.js.

Maybe it would be good to have a display locale (eg /ch) and a real loaded locale (eg /de-ch or /de) in future therefore.

[shanejones]

I'm also having the randomly switching and also the issue of the white pages too.

@novelnet's idea at the end there sounds like a great approach.

[emilpriverrc]

We have the exact problem. We could not use NO and DK and needed to use nb and da. Think this plugin is outdated and don't use the updated version of formatjs

[rzubrycki]

Hey, I've just added "de" to the options and now I get the same error as you guys.

 languages: [`cn`, `de`, `en`, `es`, `fr`, `it`, `pl`, `vi`],

[rzubrycki]

Basically without 'de' it's working nicely, when I add 'de' it falls apart but only on netlify. Locally it's building without any errors.