React项目按需引入Ant Design Mobile后，样式文件不生效的解决方案

背景介绍：

在 React 项目中，为了减小包的体积，在确定了使用 Ant Design Mobile UI组件库之后，按照官方文档，采用按需引入的方案，引入组件后，样式文件并未生效

1. 测试按需加载组件

// 按照官方文档在 **App.js** 中引入 Button 按钮测试是否生效
import { Button } from 'antd-mobile'
function App () {
	<div>
		<Button type="primary">快点我~~~</Button>
	</div>
}

期望实现效果:

现实效果：

样式文件居然没有生效，而官方文档是这样写的：

配置 babel-plugin-import后，只需从 antd-mobile 引入模块即可，无需单独引入样式

纳尼？？？那为什么我的样式文件没有生效呢？
为了解决这个问题，我决定从以下两个方面去测试一下
首先，我先是手动引入全部样式文件

import 'antd-mobile/dist/antd-mobile.css'

样式是正常显示的，没有任何问题，但是控制台提示我：

You are using a whole package of antd-mobile, please use https://www.npmjs.com/package/babel-plugin-import to reduce app bundle size.

显示我全局引入，推荐我按需引入，看着这个提示，我默默的把全局引入的代码删除了，此方法不适用

然后，我们只能换第二种方式了，既然你文件不生效，那我只有运行 npm run eject大法，来看看你 React 代码的 webpack 是怎么配置的了

npm run eject // 注意：此操作为不可逆操作，小伙伴们如果要执行此操作，可要慎重哦

然而，当我运行上述命令后，样式奇迹般的生效了，意不意外？惊不惊喜？就是这么地神奇

那么，这是为什么呢？虽然问题解决了，但是我可能项目中，不需要改 webpack配置，那我这样操作感觉也有些多余

目前暂时还没明白到底是为什么，在此记录一下，如果有大神看到，还望不吝赐教

在此附上各种依赖包的版本

"antd-mobile": "^2.3.4",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-router-dom": "^5.2.0",
"react-scripts": "4.0.3",
"babel-plugin-import": "^1.13.3"