reactjs - 与 Storybook v5 一起使用 antd for React

Question

现在，我在我的新 React 应用程序(用 create-react-app 创建)中试图让 Storybook 与 antd 一起工作几个小时，但没有成功。
无论我做什么，Storybook 都没有采用 antd 的样式。
例如，我用 antd 创建了一个菜单项:menuNav.tsx :

import React from "react";
import {Menu} from 'antd';
import "antd/dist/antd.less";


const MenuNav = () => {
    return (
        <Menu mode="horizontal">
            <Menu.Item key="menu1">
                This is my menu title
            </Menu.Item>
        </Menu>
    )
}

export default MenuNav; 

但结果看起来是这样的，根本没有样式，而是一个列表:

正如你在这里看到的，它理解菜单是由 UI 库创建的，但没有应用 antd 样式:

这是 MenuNav的故事文件, 3-Menu.stories.js :

import React from "react";

import MenuNav from '../components/MenuNav';

export default {
    title: "MenuNav",
    component: MenuNav,
};

export const Text = () => <MenuNav></MenuNav>

我已经尝试添加 config.js内 ./storybook按照建议 here ，没有成功。此外，我尝试添加一个 webpack.config.js在与推荐相同的目录中 here ，同样的结果。
我究竟做错了什么？

Answer 1

尝试添加 @import '~antd/dist/antd.css';到您的应用程序主文件，比如说 index.css例如放在 src文件夹，然后添加 import '../src/index.css';至 .storybook/preview.js`