38 lines
1.2 KiB
TypeScript
38 lines
1.2 KiB
TypeScript
import React from 'react';
|
|
import { BrowserRouter, Routes, Route } from 'react-router-dom';
|
|
import { Header } from './components/layout/Header';
|
|
import { Suspense, lazy } from 'react';
|
|
import Footer from './components/Footer';
|
|
|
|
// Lazy load pages
|
|
const Home = lazy(() => import('./pages/Home'));
|
|
const Daily = lazy(() => import('./pages/Daily'));
|
|
const Article = lazy(() => import('./pages/Article'));
|
|
|
|
function App() {
|
|
return (
|
|
<BrowserRouter>
|
|
<div className="flex flex-col min-h-screen bg-white dark:bg-neutral-900 text-gray-900 dark:text-gray-100">
|
|
<Header />
|
|
{/* 页眉分隔线 */}
|
|
<div className="w-[95%] mx-auto">
|
|
<div className="border-t-2 border-gray-900 dark:border-gray-100 w-full mb-2" />
|
|
</div>
|
|
|
|
<main className="flex-1 w-[95%] mx-auto py-8">
|
|
<Suspense fallback={<div>Loading...</div>}>
|
|
<Routes>
|
|
<Route path="/" element={<Home />} />
|
|
<Route path="/daily" element={<Daily />} />
|
|
<Route path="/posts/:articleId" element={<Article />} />
|
|
</Routes>
|
|
</Suspense>
|
|
</main>
|
|
|
|
<Footer />
|
|
</div>
|
|
</BrowserRouter>
|
|
);
|
|
}
|
|
|
|
export default App;
|