今天我写了一个react演示应用程序，现在我发现启动应用程序时Web UI没有呈现任何内容。这是我的index.tsx：

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import { Provider } from 'react-redux';
import reportWebVitals from './reportWebVitals';
import store  from './store/store';
import routes from './routes/routes';

const root = ReactDOM.createRoot(
  document.getElementById('root') as HTMLElement
);
root.render(
  <React.StrictMode>
    <Provider store={store}>
      {routes}
    </Provider>
  </React.StrictMode>
);

reportWebVitals();

这是routes.js文件

import { Route,Routes,BrowserRouter } from 'react-router-dom';
import App from '../page/index/App';

const routes = (
    <BrowserRouter>        
        <Routes>
          <Route path="/" exact component={App}/>
        </Routes>
    </BrowserRouter>
);

export default routes;

这是App.tsx文件

function App() {
  return (
    <div>
      Hello World!
    </div>
  );
}

export default App;

当我运行此应用程序时，Web UI未呈现Hello World。我是否遗漏了一些内容？我应该如何解决此问题？这是我的package.json文件：

{
  "name": "ai-web",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@testing-library/jest-dom": "^5.16.5",
    "@testing-library/react": "^13.4.0",
    "@testing-library/user-event": "^13.5.0",
    "@types/jest": "^27.5.2",
    "@types/node": "^16.18.14",
    "@types/react": "^18.0.28",
    "@types/react-dom": "^18.0.11",
    "react": "^18.2.0",
    "react-app-rewire-alias": "^1.1.7",
    "react-dom": "^18.2.0",
    "react-redux": "^8.0.5",
    "react-router-dom": "^6.9.0",
    "react-scripts": "5.0.1",
    "redux": "^4.2.1",
    "typescript": "^4.9.5",
    "web-vitals": "^2.1.4"
  },
  "scripts": {
    "start": "react-app-rewired start --config-overrides ./src/config/build/config-overrides.js",
    "build": "react-app-rewired build --config-overrides path/to/config-overrides.js",
    "test": "react-app-rewired test --config-overrides path/to/config-overrides.js",
    "eject": "react-app-rewired eject"
  },
  "eslintConfig": {
    "extends": [
      "react-app",
      "react-app/jest"
    ]
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "react-app-rewired": "^2.2.1"
  }
}

这是我的商店. js：

import {createStore} from 'redux';
import rootReducer from '../common/combineReducer';

const store = createStore(rootReducer);

export default store;

这是rootReducer：

import { combineReducers } from 'redux';
import chat from '../reducer/chat/ChatReducer';

const rootReducer = combineReducers({
    chat
})

export default rootReducer;

这是chatReducer（我想它现在没有使用reducer）：

const initState = {
    article: {}
};

const ChatReducer = (state=initState, action) => {
    switch (action.type) {
        case "GET_ARTICLE":
            state = action.article;
            break;
        default:
            break;
    }
    return state;
};

export default ChatReducer;