Antd@4 dayjs moment

DatePicker

import { Dayjs } from 'dayjs';
import dayjsGenerateConfig from 'rc-picker/lib/generate/dayjs';
import generatePicker from 'antd/es/date-picker/generatePicker';
import 'antd/es/date-picker/style/index';

const DatePicker = generatePicker<Dayjs>(dayjsGenerateConfig);

export default DatePicker;

TimePicker

import { Dayjs } from 'dayjs';
import * as React from 'react';
import DatePicker from './DatePicker';
import { PickerTimeProps } from 'antd/es/date-picker/generatePicker';
import { Omit } from 'antd/es/_util/type';

export interface TimePickerProps extends Omit<PickerTimeProps<Dayjs>, 'picker'> {
}

const TimePicker = React.forwardRef<any, TimePickerProps>((props, ref) => {
  return <DatePicker {...props} picker="time" mode={undefined} ref={ref} />;
});

TimePicker.displayName = 'TimePicker';

export default TimePicker;

Calendar

import { Dayjs } from 'dayjs';
import dayjsGenerateConfig from 'rc-picker/lib/generate/dayjs';
import generateCalendar from 'antd/es/calendar/generateCalendar';
import 'antd/es/calendar/style';

const Calendar = generateCalendar<Dayjs>(dayjsGenerateConfig);

export default Calendar;

Demo

src/components antd DatePicker, Calendar <DatePicker picker="time" /> antd <TimePicker/>

- import { DatePicker, Calendar } from 'antd';
- import format from 'moment';
+ import { DatePicker,Calendar } from '@/components';
+ import format from 'dayjs';

src/pages/index.tsx

dayjs moment 0.55MB

moment

File sizes after gzip:

  291.96 KB  dist/umi.js
  14.61 KB   dist/umi.css

dayjs

File sizes after gzip:

  207.52 KB  dist/umi.js
  14.49 KB   dist/umi.css