npm install -g create-react-app

npx create-react-app project-name 

npm start 

declare module '@loadable/component'

npm i antd react-router react-router-dom redux react-redux redux-actions @types/redux-actions @types/react-router-dom @loadable/component axios loadash --save

import loadable from '@loadable/component';
import { RouteComponentProps } from 'react-router';

const Index = loadable(() => import('../pages/index'));
const Login = loadable(() => import('../pages/login'));

export interface RouteConfigProps {
  path: string,
  exact: boolean,
  component: React.ComponentType<RouteComponentProps<any>> | React.ComponentType<any>,
  id: number,
  name?: string,
  routes?: Array<RouteConfigProps>
}
export const routeConfig: Array<RouteConfigProps> = [
  {
    path: '/login',
    exact: true,
    component: Login,
    id: 1,
    name: '登陸',
    routes: []
  },
  {
    path: '/index',
    exact: false,
    component: Index,
    id: 2,
    name: '首頁',
    routes: []
  }
]

import React from 'react';
import { Provider } from 'react-redux'; // redux提供的provider。
import zhCN from 'antd/es/locale-provider/zh_CN'; // antd的中文包
import { HashRouter } from 'react-router-dom'; 
import { MyRouter } from './router'; // 剛才的router.tsx
import { ConfigProvider, message, notification } from 'antd'; 
import storeConfig from './store'; // redux的倉庫
import moment  from 'moment'; // momentjs。
import 'moment/locale/zh-cn'; // 中文包moment.js
import 'antd/dist/antd.css'; // 引入antd的樣式表
import './App.css'
moment.locale('zh-cn'); // 將moment.js設(shè)置為中文

const store = storeConfig(); // 初始化redux的store，如不需要狀態(tài)管理器，redux相關(guān)可以忽略。

message.config({ // antd的message組件配置，during持續(xù)時(shí)間單位為秒，maxcount最多顯示個(gè)數(shù)
  duration: 2,
  maxCount: 2
});
notification.config({
  placement: 'topRight', // antd的通知組件配置，placement彈出位置。bottom距離底部的距離，during持續(xù)時(shí)間單位為秒
  bottom: 50,
  duration: 2,
});
function App() {
  return (
    <Provider store={store}>
      <ConfigProvider locale={zhCN}>
        <HashRouter>
          <MyRouter />
        </HashRouter>
      </ConfigProvider>
    </Provider>
  );
}

export default App;