错误：[ProxyFacade] 不是 <Route> 组件。 <Routes> 的所有子组件必须是 <Route> 或 <React.Fragment>答案

【问题标题】：Error: [ProxyFacade] is not a <Route> component. All component children of <Routes> must be a <Route> or <React.Fragment>错误：[ProxyFacade] 不是 <Route> 组件。 <Routes> 的所有子组件必须是 <Route> 或 <React.Fragment>
【发布时间】：2021-12-30 08:46:00
【问题描述】：

我在 React 17 中使用“react-router-dom”：“6.0.2”。我使用的是打字稿。我试图添加路线。但是出现错误

未捕获的错误：[ProxyFacade] 不是组件。的所有子组件必须是 a 或

我不知道是什么问题。我错过了什么。

App.tsx

import * as React from "react";
import "./index.less";
import { BrowserRouter, Route, Routes } from "react-router-dom";
import { hot } from "react-hot-loader";
import SignIn from "../sign-in";
import SignUp from "../sign-up";

const App = () => {
  return (
    <BrowserRouter>
      <Routes>
        <Route path="/" element={<SignIn />} />
        <Route path="/signup" element={<SignUp />} />
      </Routes>
    </BrowserRouter>
  );
};
declare let module: Record<string, unknown>;

export default hot(module)(App);

登录/index.tsx

import * as React from "react";
const SignIn = () => {
  return (
    <React.Fragment>
      <div>
        <p>Sign In</p>
      </div>
    </React.Fragment>
  );
};

export default SignIn;

注册/index.tsx

import * as React from "react";
const SignUp = () => {
  return (
    <React.Fragment>
      <div>
        <p>Sign In</p>
      </div>
    </React.Fragment>
  );
};

export default SignUp;

【问题讨论】：

标签： reactjs react-router react-router-dom

【解决方案1】：

这可能与 react hot loader 有关。热加载器用代理包装所有东西[因此错误中的[ProxyFacade]]。 React 路由器代码可能会查看函数（组件）的类型，以验证 Routes 是否有除 Route 组件之外的任何子组件。请参阅问题here。

您可以先尝试不使用热加载器，看看您是否仍然遇到问题。如果你不这样做，那么你可以修复我上面添加的链接中提到的 react hot loader 问题。

【讨论】：

当然@akshay sehgal，会试试这个
成功了吗？我面临同样的问题..但它似乎与 Hot 无关，所以我不知道.. 谢谢