Search code examples
javascriptecmascript-6date-fns

Issue with Parsing Date and Time Using Date-FNS

I have here a date and time and I'm wondering its outputting an incorrect date and time. 2022-05-19T21:53:00+00:00. Its currently outputting May 20. It should be May 19 still?

CODESANDBOX: CLICK HERE

import { format, parseISO } from "date-fns";

let date = "2022-05-19T21:53:00+00:00";

document.getElementById("app").innerHTML = `
<div>${format(parseISO(date), "LLL dd, y hh:mm bbb")}</div>
`;
Solution

  • You don't actually need date-fns you can simply use a native Date with toLocaleDateString().

    let date = "2022-05-19T21:53:00+00:00";

const options = {
  month: 'long',
  day: 'numeric',
  year: 'numeric',
  hour: 'numeric',
  minute: 'numeric',
  timeZone: 'UTC'
};

const dateLocaleString = new Date(date).toLocaleDateString('en', options);

document.getElementById("app").innerHTML = `
<div>${dateLocaleString}</div>
`;
    <div id="app"></div>