Aqui está meu código:
-Rotas
import {
BrowserRouter as Router,
Routes,
Route,
} from "react-router-dom"
import { Home } from '../pages/Home';
import { Cart } from '../pages/Cart';
import { Catalog } from '../pages/catalog';
export function AppRoutes() {
return (
<Router>
<Routes>
<Route path='/' element={<Home />} />
<Route path='/Cart' element={<Cart />} />
<Route path='/catalog' element={<Catalog />} />
</Routes>
</Router>
)
}
-App.tsx
import { useState } from "react"
import { Tweet } from "./components/Tweet"
import {AppRoutes} from './routes/Routes'
function App() {
return (
<AppRoutes />
)
}
export default App
-tsconfig.json
{
"compilerOptions": {
"target": "ESNext",
"useDefineForClassFields": true,
"lib": ["DOM", "DOM.Iterable", "ESNext"],
"allowJs": false,
"skipLibCheck": false,
"esModuleInterop": false,
"allowSyntheticDefaultImports": true,
"strict": true,
"forceConsistentCasingInFileNames": true,
"module": "ESNext",
"moduleResolution": "Node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react-jsx"
},
"include": ["src", "routes", "routes/Routes.tsx"],
"references": [{ "path": "./tsconfig.node.json" }]
}