Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Text content did not match. Server when i'm using toLocaleDateString to format dates #6701

Closed
mu7amad opened this issue Mar 18, 2019 · 4 comments

Comments

@mu7amad
Copy link

mu7amad commented Mar 18, 2019

Bug report

Describe the bug

I'm trying to display dates depend on local, and for that, I'm using toLocaleDateString()
API
i would like to know how to fix this console error.

To Reproduce

class Review extends React.Component {
    render() {
        const { review, theme } = this.props;
        const componentStyle = theme.components.review;
        const reviewDate = new Date(review.date);
        const date = reviewDate.toLocaleDateString('de-DE');
        return (
            <React.Fragment>
                <time dateTime={date}>{date}</time> <Seprator>{review.name ? '|' : ''}</Seprator>{' '}
                <span>{review.name}</span>
                <RatingBar rating={review.rating} />
                <H4 margin={`${componentStyle.title.marginTop} 0 ${componentStyle.title.marginBottom} 0`}>
                    {review.title}
                </H4>
                <Paragraph>{review.text}</Paragraph>
            </React.Fragment>
        );
    }
}

Screenshots

image

@nblthree
Copy link
Contributor

the Locales argument de-DE isn't supported in your server (system) in my case it return 2019-3-19 because it's not supported in my system too, it's the same if I pass some false value like ee-UM but if I pass en-US it return 3/19/2019 which mean that if the passed value isn't supported or false toLocaleDateString will fallback to the default value in your system.
To solve this problem use a custom function

@Timer Timer closed this as completed Jun 14, 2019
@nicolasrouanne
Copy link
Contributor

nicolasrouanne commented Apr 6, 2020

Falling back to the default system language is indeed the expected behavior, however maybe there could be a recommended way for adding languages files to next when not using an i18n library.

For instance, my app is only in French; I don't need an i18n solution. However new Date().toLocaleDateString('fr-FR') doesn't work server-side. The solution found so far is to install the full-icu package.
This is also in an example using full-icu.

It seems overkill to add the whole ICU languages for one language though...

@nblthree
Copy link
Contributor

nblthree commented Apr 6, 2020

It's now supported by Node v13

@balazsorban44
Copy link
Member

This issue has been automatically locked due to no recent activity. If you are running into a similar issue, please create a new issue with the steps to reproduce. Thank you.

@vercel vercel locked as resolved and limited conversation to collaborators Jan 30, 2022
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

5 participants