docs: Update FAQ replace momentjs to Day.js with antd-dayjs-webpack-plugin (#19960)

* docs: Update FAQ replace momentjs to Day.js with antd-dayjs-webpack-plugin

* update use-with-create-react-app doc

* update getting-started doc

* update use-with-create-react-app doc

docs/react/faq.en-US.md

@@ -56,6 +56,10 @@ import { Menu, Breadcrumb, Icon } from 'antd';
 
 See: https://github.com/jmblog/how-to-optimize-momentjs-with-webpack
 
+### How to replace momentjs to Day.js to reduce bundle size？
+
+We provide `antd-dayjs-webpack-plugin` plugin to replace `momentjs` to `Day.js` directly without changing a line of existing code. More info at [antd-dayjs-webpack-plugin](https://github.com/ant-design/antd-dayjs-webpack-plugin).
+
 ### It doesn't work when I change `defaultValue` dynamically.
 
 The `defaultXxxx` (like `defaultValue`) of `Input`/`Select`(etc...) only works on the first render. It is a specification of React. Please read [React's documentation](https://facebook.github.io/react/docs/forms.html#controlled-components).

docs/react/faq.zh-CN.md

@@ -56,6 +56,10 @@ import { Menu, Breadcrumb, Icon } from 'antd';
 
 参考：https://github.com/jmblog/how-to-optimize-momentjs-with-webpack 。
 
+### 如何使用 Day.js 替换 momentjs 来减小打包大小？
+
+我们提供了 `antd-dayjs-webpack-plugin` 插件，无需对现有代码做任何修改直接替换成 `Day.js`。请参考 [antd-dayjs-webpack-plugin](https://github.com/ant-design/antd-dayjs-webpack-plugin)。
+
 ### 当我动态改变 `defaultValue` 的时候它并没有生效。
 
 `Input`/`Select` 等的 `defaultXxxx`（例如 `defaultValue`）只有在第一次渲染的时候有效，这是 React 的规范，请阅读 [React 的文档](https://reactjs.org/docs/forms.html#controlled-components)。

docs/react/getting-started.en-US.md

@@ -151,6 +151,22 @@ And this plugin can load styles too. Read [usage](https://github.com/ant-design/
 
 > FYI, babel-plugin-import's `style` option will importing some global reset styles, don't use it if you don't need those styles. You can import styles manually via `import 'antd/dist/antd.css'` and override the global reset styles.
 
+## Replace momentjs to Day.js
+
+You can use [antd-dayjs-webpack-plugin](https://github.com/ant-design/antd-dayjs-webpack-plugin) plugin to replace momentjs to Day.js to reduce bundle size dramatically. You need to update your webpack config file like this:
+
+```js
+// webpack-config.js
+import AntdDayjsWebpackPlugin from 'antd-dayjs-webpack-plugin';
+
+module.exports = {
+  // ...
+  plugins: [
+    new AntdDayjsWebpackPlugin()
+  ]
+};
+```
+
 ## Customization
 
 - [Customize Theme](/docs/react/customize-theme)

docs/react/getting-started.zh-CN.md

@@ -156,6 +156,22 @@ import { Button } from 'antd';
 
 > 注意，babel-plugin-import 的 `style` 属性除了引入对应组件的样式，也会引入一些必要的全局样式。如果你不需要它们，建议不要使用此属性。你可以 `import 'antd/dist/antd.css'` 手动引入，并覆盖全局样式。
 
+## 使用 Day.js 替换 momentjs 优化打包大小
+
+你可以使用 [antd-dayjs-webpack-plugin](https://github.com/ant-design/antd-dayjs-webpack-plugin) 插件用 Day.js 替换 momentjs 来大幅减小打包大小。这需要更新 webpack 的配置文件如下：
+
+```js
+// webpack-config.js
+import AntdDayjsWebpackPlugin from 'antd-dayjs-webpack-plugin';
+
+module.exports = {
+  // ...
+  plugins: [
+    new AntdDayjsWebpackPlugin()
+  ]
+};
+```
+
 ## 配置主题和字体
 
 - [改变主题](/docs/react/customize-theme)

docs/react/use-with-create-react-app.en-US.md

@@ -199,6 +199,25 @@ We use `modifyVars` option of [less-loader](https://github.com/webpack/less-load
 
 > You could also try [craco](https://github.com/sharegate/craco) and [craco-antd](https://github.com/FormAPI/craco-antd) to customize create-react-app webpack config same as customize-cra does.
 
+## Replace momentjs to Day.js
+
+You can use [antd-dayjs-webpack-plugin](https://github.com/ant-design/antd-dayjs-webpack-plugin) plugin to replace momentjs to Day.js to reduce bundle size dramatically.
+
+```bash
+$ yarn add antd-dayjs-webpack-plugin
+```
+
+```js
+const { override, addWebpackPlugin } = require('customize-cra');
+const AntdDayjsWebpackPlugin = require('antd-dayjs-webpack-plugin');
+
+module.exports = override(
+  addWebpackPlugin(
+    new AntdDayjsWebpackPlugin()
+  )
+);
+```
+
 ## eject
 
 You can also eject your application using [yarn run eject](https://facebook.github.io/create-react-app/docs/available-scripts#npm-run-eject) for a custom setup of create-react-app, although you should dig into it by yourself.

docs/react/use-with-create-react-app.zh-CN.md

@@ -201,6 +201,25 @@ module.exports = override(
 
 > 你也可以使用 [craco](https://github.com/sharegate/craco) 和 [craco-antd](https://github.com/FormAPI/craco-antd) 来实现和 customize-cra 一样的修改 create-react-app 配置的功能。
 
+## 使用 Day.js 替换 momentjs 优化打包大小
+
+你可以使用 [antd-dayjs-webpack-plugin](https://github.com/ant-design/antd-dayjs-webpack-plugin) 插件用 Day.js 替换 momentjs 来大幅减小打包大小。
+
+```bash
+$ yarn add antd-dayjs-webpack-plugin
+```
+
+```js
+const { override, addWebpackPlugin } = require('customize-cra');
+const AntdDayjsWebpackPlugin = require('antd-dayjs-webpack-plugin');
+
+module.exports = override(
+  addWebpackPlugin(
+    new AntdDayjsWebpackPlugin()
+  )
+);
+```
+
 ## eject
 
 你也可以使用 create-react-app 提供的 [yarn run eject](https://facebook.github.io/create-react-app/docs/available-scripts#npm-run-eject) 命令将所有内建的配置暴露出来。不过这种配置方式需要你自行探索，不在本文讨论范围内。