Reactjs 无法安装dnd包

*下面是安装软件包时的完整错误堆栈消息

npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: freeboard@0.1.0
npm ERR! Found: react@17.0.1
npm ERR! node_modules/react
npm ERR!   react@"^17.0.1" from the root project
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! peer react@"^16.8.5" from react-beautiful-dnd@13.0.0
npm ERR! node_modules/react-beautiful-dnd
npm ERR!   react-beautiful-dnd@"^13.0.0" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

以下是使用dragdropcontext和可从包（完整的主组件）中删除的完整代码。 以下是使用dragdropcontext和可从包中删除的完整代码，即完整的主组件。

import { connect } from "react-redux"
import { DragDropContext, Droppable } from 'react-beautiful-dnd';


import SingleTask from "../SingleTask/SingleTask"

import "./Main.css"

const Main = (props) => {

    const [tasks, setTasks] = useState([])

    useEffect(() => {
        setTasks(...[props.tasks])
    },[props])


    return (
        <>
        <DragDropContext>
            <Droppable droppableId="Box1">
                {(provided) => (    
                    <div {...provided.droppableProps} ref={provided.innerRef}>
                        {provided.placeholder}
                        <div className="main-board">
                            <h2>FreeBoard</h2>

                            { tasks && tasks.map((task, index) => {
                                return (
                                    <div className="tasks-list" key={index}>
                                        <SingleTask taskName={task} indexCount={index}/>
                                    </div>
                                )
                            }) }
                        </div>
                    </div>
                )}
            </Droppable>
        </DragDropContext>
        </>
    )
}

const mapStateToProps = state => {
    return state
}

export default connect(mapStateToProps)(Main)

从“react redux”导入{connect}
从'react Beauty dnd'导入{DragDropContext，Dropable}；
从“./SingleTask/SingleTask”导入SingleTask
导入“/Main.css”
常量Main=（道具）=>{
const[tasks，setTasks]=useState（[]
useffect（（）=>{
setTasks（…[props.tasks]）
}[道具]）
返回(
{（提供）=>（
{提供的.占位符}
干舷
{tasks&&tasks.map（（任务，索引）=>{
返回(
)
}) }
)}
)
}
常量mapStateToProps=状态=>{
返回状态
}
导出默认连接（MapStateTops）（主）

我认为您的缓存有问题，因为它在我的机器上工作正常，没有错误。删除节点模块，更新npm

npm-g安装npm

---

然后重新安装所有内容。

我认为您的缓存有问题，因为它在我的机器上工作正常，没有任何错误。删除节点模块，更新npm

npm-g安装npm

---

然后重新安装所有内容。

npm ERR！修复上游依赖项冲突，或重试npm ERR！使用--force或--legacy peer deps执行此命令时

是否尝试了这些命令？如果尝试了，则，-legacy peer deps未安装，-force正在安装程序包，但无法使用该程序包的内容。例如，DragDropContext等正在抛出错误，如“错误：钩子调用无效。钩子只能在函数组件的主体内部调用。发生这种情况的原因可能是：”

npm ERR！修复上游依赖项冲突，或重试npm ERR！使用--force或--legacy peer deps执行此命令时

是否尝试了这些命令？如果尝试了，则，-legacy peer deps未安装，-force正在安装程序包，但无法使用该程序包的内容。例如，DragDropContext等正在抛出错误，如“错误：无效的钩子调用。钩子只能在函数组件的主体内部调用。这可能是由于以下原因之一：”我尝试强制执行。安装后，如果我使用DragDropContext，我会收到以下错误“未捕获错误：无效的钩子调用。钩子只能在函数组件主体内部调用”。同一个应用程序中不应该有两个react版本。我不记得我到底做了什么，但我很肯定这不是一个好主意。它可以安装两个不同版本的react。您可以通过npm ls react进行检查。并且可以减少你的反应版本。但无论如何，我的应用程序已经完美地安装了dndreact@17.0.1已安装。您是否也可以显示正在使用

DragDropContext

的代码？也许你用错误的方式调用了hook添加了上面的代码，我卸载并尝试再次安装这个包，但没有强制安装。与上面相同的错误请提供所有相关的代码，以及整个组件。我试着强制执行。安装后，如果我使用DragDropContext，我会收到以下错误“未捕获错误：无效的钩子调用。钩子只能在函数组件主体内部调用”。同一个应用程序中不应该有两个react版本。我不记得我到底做了什么，但我很肯定这不是一个好主意。它可以安装两个不同版本的react。您可以通过npm ls react进行检查。并且可以减少你的反应版本。但无论如何，我的应用程序已经完美地安装了dndreact@17.0.1已安装。您是否也可以显示正在使用

DragDropContext

的代码？也许你用错误的方式调用了hook添加了上面的代码，我卸载并尝试再次安装这个包，但没有强制安装。与上述错误相同，请提供所有相关代码，以及整个组件。