Server Side Rendering, attribute locale is ignored

I am having an issue, locale: 'fr' attribute is ignored when I am rendering my React app on Server Side.

When the client has finished to download the js bundles, my locale is not ignored anymore then it’s OK. But it does a FOUC (Flash Of Unstyled Component).

I would better say it does a FOMLD (Flash Of Misconfigured Locale Date). I mean 2 seconds in English then French (because my browser is in french)

• When I am running on my local environment (my Macintosh) it works fine !!! I get the browser language with express js req.headers[‘Accept-Language’] and then it goes in a date time for example

DateTime.fromFormat(myGrossDateTime, 'yyyy-MM-dd', {
  zone: 'UTC',
  locale: 'fr'
})
  .setZone(timezone)
  .toLocaleString({
    year: '2-digit',
    month: '2-digit',
    day: '2-digit'
  })

• When I am running in my production environment on my Kubernetes Cluster. I do exactly the same ! req.headers[‘Accept-Language’] is working fine I already checked. But DateTime.fromObject({ locale: "fr" }).resolvedLocaleOpts(); falls back on en-us I checked your code https://github.com/moment/luxon/blob/master/src/impl/locale.js#L238

  resolvedOptions() {
    if (this.hasIntl) {
      return this.dtf.resolvedOptions();
    } else {
      return {
        locale: "en-US",
        numberingSystem: "latn",
        outputCalendar: "gregory"
      };
    }
  }

And yes my Node.js version has Intl support (docker alpine:3.11). I checked myself using the exact code you use, try catch…

It keeps pointing on

{
  locale: "en-US",
  numberingSystem: "latn",
  outputCalendar: "gregory"
}

Why it keeps doing this on my production environment please ? any clue ?

[tomtom94]

You are right !

  console.log('test icambron', new Intl.DateTimeFormat('fr', { month: 'long' }).format())

My Macintosh test icambron septembre in french

My Kubernetes cluster test icambron September in english

This is my fucking docker import of Node.js alpine:3.11

FROM alpine:3.11

RUN mkdir -p /usr/src/app

WORKDIR /usr/src/app

ENV NPM_CONFIG_LOGLEVEL warn
ENV PORT 80

ENV BACKEND_BASE_URL https://server.XXXXXX.com

RUN apk add --update npm
COPY package*.json ./
RUN npm install
COPY . .

RUN npm run build

EXPOSE 80

CMD ["npm", "start"]

Alpine is a compressed Node.js version made by Linux, and it messes this up, I am not counting the MegaBytes on my server whatever.

Many thanks, and by the way, great module !! great support !! Au revoir, voila.

[tomtom94]

Just add ICU support for Node.js https://moment.github.io/luxon/docs/manual/install.html and it works just fine

3 ligns in your Dockerfile

USER root
RUN npm install --unsafe-perm -g full-icu
ENV NODE_ICU_DATA="/usr/lib/node_modules/full-icu"

The full Dockerfile below

FROM alpine:3.11

USER root

RUN mkdir -p /usr/src/app

WORKDIR /usr/src/app

ENV NODE_VERSION 14.11.0
ENV NPM_CONFIG_LOGLEVEL warn
ENV PORT 80

ENV BACKEND_BASE_URL https://server.XXXXXXX.com

RUN apk add --update npm

RUN npm install --unsafe-perm -g full-icu
ENV NODE_ICU_DATA="/usr/lib/node_modules/full-icu"

COPY package*.json ./
RUN npm install
COPY . .

RUN npm run build

EXPOSE 80

CMD ["npm", "start"]