I use babel and webpack to bundle the react app.When I import the Router, the page presents white. And the log below :

Uncaught ReferenceError: exports is not defined
    at Module../node_modules/@babel/runtime/helpers/esm/extends.js (index.css:9:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at Object../node_modules/history/index.js (index.ts:20:1)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at Object../node_modules/react-router-dom/index.js (index.js:38:2)
    at __webpack_require__ (bootstrap:24:1)
    at fn (hot module replacement:62:1)
    at Object../src/App.jsx (App.jsx:5:1)

and my code :

import React from "react"
import Look from "./components/Look.jsx"
import Edit from "./components/Edit.jsx"
import "./css/index.css"
import { HashRouter, Routes, Route } from "react-router-dom";

export default function App() {
    return (
        <>
            <h1 className="title">App</h1>
            <HashRouter>
                <Routes>
                    <Route path='/' element={<Edit />} />
                    <Route path='/look' element={<Look />} />
                </Routes>
            </HashRouter>
        </>
    )
}