React， react-router useHistory.未捕获错误:无效的挂钩调用

Question

我只有一个 React 的副本，用npm ls react检查它，react 和 react-dom 是同一个版本，我没有违反任何钩子规则，对吗？我不知道该怎么办了。

ERROR: Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

我的组件：

import React from "react";
import { useHistory } from "react-router-dom";
export default function HomeButton() {
let history = useHistory();
function handleClick() {
history.push("/home");
}
return (
<button type="button" onClick={handleClick}>
Go home
</button>
);
}

包.json

"dependencies": {
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.5.0",
"@testing-library/user-event": "^7.2.1",
"axios": "^0.19.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-scripts": "3.4.1",
"styled-components": "^5.1.1"
},

Answer 1

解决了， 在 webpack.config 中添加.js在"解决以下问题"下：

alias: {
react: path.resolve("./node_modules/react"),
}

我使用create-react-app，所以我不得不运行npm运行弹出，这是不推荐的。有人对未来有更好的 idé 吗？