我已经遵循了React.js中关于Chakra UI安装的文档。我正在处理的组件在一个单独的项目中工作，但当我将其添加到当前项目时，它并不具有样式。而是显示纯html
index.js

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import { ChakraProvider, theme } from "@chakra-ui/react";
import Test from "./pages/Test";
const root = ReactDOM.createRoot(document.getElementById("root"));
root.render(
  <React.StrictMode>
    <ChakraProvider theme={theme} />
        <Test />
    <ChakraProvider />
  </React.StrictMode>
);

Test.js

import React, { ReactNode } from 'react';
import {
    IconButton,
    Avatar,
    Box,
    CloseButton,
    Flex,
    HStack,
    VStack,
    Icon,
    useColorModeValue,
    Link,
    Drawer,
    DrawerContent,
    Text,
    useDisclosure,
    BoxProps,
    FlexProps,
    Menu,
    MenuButton,
    MenuDivider,
    MenuItem,
    MenuList,
} from '@chakra-ui/react';
import {
    FiHome,
    FiTrendingUp,
    FiCompass,
    FiStar,
    FiSettings,
    FiMenu,
    FiBell,
    FiChevronDown,
} from 'react-icons/fi';
import { IconType } from 'react-icons';
import { ReactText } from 'react';
import Rideshare from './Rideshare'
....
rest of my  code

package.json

.....
"dependencies": {
    "@chakra-ui/react": "^2.3.7",
    "@emotion/react": "^11.10.5",
    "@emotion/styled": "^11.10.5",
    "@react-google-maps/api": "^2.13.1",
    "@testing-library/jest-dom": "^5.16.4",
    "@testing-library/react": "^13.3.0",
    "@testing-library/user-event": "^13.5.0",
    "axios": "^0.19.2",
    "bootstrap": "^5.1.3",
    "dayjs": "^1.11.6",
    "framer-motion": "^6.5.1",
    "http-proxy-middleware": "^2.0.6",
    "jwt-decode": "^3.1.2",
    "query-string": "^6.13.7",
    "react": "^18.2.0",
    "react-dom": "^18.2.0",
    "react-icons": "^4.6.0",
    "react-redux": "^7.2.0",
    "react-router-dom": "^6.3.0",
    "react-scripts": "5.0.1",
    "react-slick": "^0.29.0",
    "reactstrap": "^9.1.1",
    "redux": "^4.0.5",
    "redux-devtools-extension": "^2.13.8",
    "redux-thunk": "^2.3.0",
    "remixicon": "^2.5.0",
    "slick-carousel": "^1.8.1",
    "web-vitals": "^2.1.4"
  },
.....

我尝试使用命令重新安装Chakra-UI

npm i @chakra-ui/react @emotion/react @emotion/styled framer-motion

但这个解决方案并不奏效我的package.json显示Chakra-UI已安装。