Make moment.js tree-shakable by moving ConfigConsumerProps to own file (v1)

[lukaw3d]

This is a ...

• New feature
• Bug fix
• Site / document update
• Component style update
• TypeScript definition update
• Refactoring
• Code style optimization
• Branch merge
• Other (about what?): import module size

What's the background?

1. Describe the source of requirement.

If an app only wants to import some components, the import package size should be small. e.g.

// using babel-plugin-import in babelrc:
["import", { "libraryName": "ant-design-vue", "libraryDirectory": "es", "style": "css" }]

// only importing some components in src/main.js:
import { Badge, Popconfirm, Table } from 'ant-design-vue';
console.log(Badge);

// run
npx vue-cli-service build --report --mode production src/main.js

But this creates a 400KB bundle 😨 with most of it being moment.js

2. Resolve what problem.

Badge imports moment.js this way:

• ant-design-vue/components/badge/Badge.jsx

  Lines 43 to 45 in 0f46769

  	inject: {
  	configProvider: { default: () => ConfigConsumerProps },
  	},

• ant-design-vue/components/badge/Badge.jsx

  Line 14 in 0f46769

  import { ConfigConsumerProps } from '../config-provider';

• ant-design-vue/components/config-provider/index.jsx

  Lines 85 to 91 in 0f46769

  	export const ConfigConsumerProps = {
  	getPrefixCls: (suffixCls, customizePrefixCls) => {
  	if (customizePrefixCls) return customizePrefixCls;
  	return `ant-${suffixCls}`;
  	},
  	renderEmpty: defaultRenderEmpty,
  	};

• ant-design-vue/components/config-provider/index.jsx

  Line 6 in 0f46769

  import LocaleProvider, { ANT_MARK } from '../locale-provider';

• ant-design-vue/components/locale-provider/index.jsx

  Line 2 in 0f46769

  import * as moment from 'moment';

So by moving ConfigConsumerProps out of components/config-provider/index.jsx, moment.js will not be imported and now bundle takes only 80KB.

(moment.js will still be imported if e.g. import { ConfigProvider, Calendar } from 'ant-design-vue';).

What's the effect?

1. Does this PR affect user? Which part will be affected?

If user imports only a few components, their tree-shaked bundle will not include moment.js, reducing their bundle size

   File                         Size                             Gzipped

-  dist/js/app.93a8b94c.js      449.68 KiB                       134.98 KiB
+  dist/js/app.98dd1930.js      80.62 KiB                        27.03 KiB
   dist/css/app.1e590c7a.css    40.28 KiB                        4.88 KiB

2. What will say in changelog?

Make moment.js tree-shakable

3. Does this PR contains potential break change or other risk?

No

Changelog description (Optional if not new feature)

1. English description

Make moment.js tree-shakable

2. Chinese description (optional)

Self Check before Merge

• Doc is updated/provided or not needed
• Demo is updated/provided or not needed
• TypeScript definition is updated/provided or not needed
• Changelog is provided or not needed

[ekoeryanto]

using moment as deps in browser is good choice 🤣

[github-actions]

This pull request has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.