正文
自从上次把基础环境搭建好之后，开始进行开发页面，结果进入通过手动在浏览器地址栏输入网址时出现了个路由错误：
Cannot Get /system
这里的 /system 是我在页面加的一个路由，代码片段是下面这样的：
<article className={"app-apple"}> <header> <Link to={"."}>App Apple</Link> <Link to={"system"}>System</Link> <Link to={"database"}>Database</Link> </header> <section> <Routes> <Route path={"system"} element={<System/>}/> <Route path={"database"} element={<Database/>}/> </Routes> </section> <footer> app-apple: 占位 </footer> </article>
前端使用的是 React 技术栈，路由所用的库是：react-route-dom，使用的路由类型是：BrowserRouter。这个库很好用，由于它最近有版本升级，从 v5 升级到 v6，很多以前的支持的 api 都不能了，有的直接弃用了，有的换了更优质的实现。本来我以为出现的错误是由于 react-route-dom 的版本升级导致的不兼容问题，于是找到官网的版本升级文档——UPGRADING FROM V5，从头到尾看了一遍，最后找到原因是 webpack 的配置导致的。
在 webpack.config.js 配置文件里需要加上下面这段以支持 BroserRouter。
module.exports = { //... devServer: { //... historyApiFallback: true //... } }
在 webpack 官网也明确说明了这个配置：
When using the HTML5 History API, the
index.htmlpage will likely have to be served in place of any404responses. EnabledevServer.historyApiFallbackby setting it totrue
Ok，问题已经解决。
