antd时间组件Datepicker day.js 替换 Moment.js

为什么要换：

Day.js 是一个轻量的处理时间和日期的 JavaScript 库
Moment.js 的大小是200多k,Day.js的大小是2kB，100倍的差距，拥有同样强大的 API。

antD时间组件Datepicker只⽀持格式为moment类型的数据，不⽀持string类型的数据。

第一种：

1、自定义组件（官网）（组件封装）：

generatePicker（或 generateCalendar）辅助创建 Picker 组件。

import { Dayjs } from 'dayjs';
import dayjsGenerateConfig from 'rc-picker/es/generate/dayjs';
import generatePicker from 'antd/es/date-picker/generatePicker';
 
const DatePicker = generatePicker<Dayjs>(dayjsGenerateConfig);
 
export default DatePicker;

当 DatePicker 引入 ranges week,month days 报错

自定义导出dayjs

import dayjs from 'dayjs';
import weekday from 'dayjs/plugin/weekday';
import localeData from 'dayjs/plugin/localeData';
 
 
dayjs.extend(weekday);
dayjs.extend(localeData);
 
export default dayjs;

 <DatePicker.RangePicker 
	ranges={{
	  今天: [dayjs(), dayjs()]
	}}
 />

关于具体造成问题的原因，从issue下面的回复有人提到是因为在node_modules中存在了两个dayjs，一个是原本通过npm或yarn引入的dayjs依赖，

另一个存在于rc-picker中的依赖(也就是antd引入的时间相关的组件模块)，

但是看了官方修复也只是把原先引入的固定版本的dayjs转变成了一个更加广泛的1.x版本，并没有删除这个依赖，所以目前具体原因不清楚

第二种：

plugins: [
    new AntdDayjsWebpackPlugin({
    preset: 'antdv3',
    replaceMoment: true
})
],

Day.js 被设计成不可变的对象，

需要 BadMutable plugin 支持（不是一个好的选择）

antd-dayjs-webpack-plugin

针对antd 4以及4之前版本）