Reactjs 将Redux与React一起使用时出错：钩子调用无效。钩子只能在函数组件的主体内部调用

刚开始学习redux并尝试制作最简单的测试应用程序。这是代码，在index.js行“ReactDOM.render（”

我对React和ReactDOM的版本是相同的

index.js：

import React from "react";
import ReactDOM from "react-dom";
import App from "./App";
import { Provider } from "react-redux";
import store from "./redux/store";

ReactDOM.render(
  <Provider store={store}>
    <React.StrictMode>
      <App />
    </React.StrictMode>
  </Provider>,
  document.getElementById("root")
);

Counter/Counter.actions.js：

export const increaseCounter = () => {
  return { type: "INCREMENT" };
};

export const decreaseCounter = () => {
  return { type: "DECREMENT" };
};

App.js：

import { connect } from "react-redux";
import React from "react";
import {
  increaseCounter,
  decreaseCounter,
} from "./redux/Counter/counter.actions";

function App({ count, increaseCounter, decreaseCounter }) {
  return (
    <div>
      <div>Count:{count}</div>
      <button onClick={() => increaseCounter()}>Increase count</button>
      <button onClick={() => decreaseCounter()}>Decrease count</button>
    </div>
  );
}

const mapStateToProps = (state) => {
  return { count: state.counter.count };
};

const mapDispatchToProps = (dispatch) => {
  return {
    increaseCounter: () => dispatch(increaseCounter()),
    decreaseCounter: () => dispatch(decreaseCounter()),
  };
};

export default connect(mapStateToProps, mapDispatchToProps)(App);

从“react redux”导入{connect}；
从“React”导入React；
进口{
递增计数器，
递减计数器，
}来自“/redux/Counter/Counter.actions”；
函数App（{count，increaseCounter，decreseCounter}）{
返回(
计数：{Count}
increaseCounter（）}>增加计数
decreaseCounter（）}>减少计数
);
}
常量mapStateToProps=（状态）=>{
返回{count:state.counter.count}；
};
const mapDispatchToProps=（调度）=>{
返回{
increaseCounter:（）=>分派（increaseCounter（）），
decreaseCounter:（）=>分派（decreaseCounter（）），
};
};
导出默认连接（mapStateToProps、mapDispatchToProps）（应用程序）；

我已经确认，假设

/redux/store

文件正常。我将确认package.json中react和react dom的版本匹配。然后删除node_modules文件夹和package-lock.json。然后运行npm install再次安装所有内容，以确保实际安装的版本与在尝试删除节点模块和package-log.json并运行npm install之前，我从开始重新安装了所有内容，并复制了文件，它正在工作：），但出现了一个错误。你认为这是为什么？还有解决问题的方法吗？犯错误发现：@babel/core@7.12.3npm错误！node_modules/@babel/core npm ERR@来自react的babel/core@“7.12.3”-scripts@4.0.3npm错误！node_modules/react scripts如果我安装的@babel/core版本与react scripts期望的版本不同，我有时会遇到类似的错误。

import { connect } from "react-redux";
import React from "react";
import {
  increaseCounter,
  decreaseCounter,
} from "./redux/Counter/counter.actions";

function App({ count, increaseCounter, decreaseCounter }) {
  return (
    <div>
      <div>Count:{count}</div>
      <button onClick={() => increaseCounter()}>Increase count</button>
      <button onClick={() => decreaseCounter()}>Decrease count</button>
    </div>
  );
}

const mapStateToProps = (state) => {
  return { count: state.counter.count };
};

const mapDispatchToProps = (dispatch) => {
  return {
    increaseCounter: () => dispatch(increaseCounter()),
    decreaseCounter: () => dispatch(decreaseCounter()),
  };
};

export default connect(mapStateToProps, mapDispatchToProps)(App);