导入 react-three-fiber 和 react-three/drei 出现问题

Question

我在app.js中导入了react-three-fiber和react-three/drei，但启动应用程序时出现以下错误：

./node_modules/@react-three/drei/core/Billboard.js 无法解析模块：在“.../node_modules/@react-three/drei/core”中无法解析“@react-three/fiber”

我是这样导入这些组件的：

import  React, { Suspense, useRef, useState } from 'react'
import { Canvas, useFrame } from 'react-three-fiber'
import { useGLTF } from '@react-three/drei/'

有人知道这个问题，我该如何解决？

- Gabriele Sabatino

---

自v6版本以来，所有的存储库都已合并到@react-three/fiber中。 - hpalu

Answer 1

补充上面的回答，如果你使用yarn，可以使用以下命令：

yarn add three @react-three/fiber
yarn add three @react-three/drei

或者

npm i three @react-three/fiber
npm i three @react-three/drei

两个包都依赖于three.js库，因此在命令中添加依赖关系是明智的。如果threejs模块未安装，则会自动安装以防止未解决的依赖关系。

- Jan Arend

Answer 2

你需要安装相关的包。你可以前往https://www.npmjs.com/网站，并在那里找到安装命令：

npm i @react-three/fiber
npm i @react-three/drei

- Georgi Ivanov Dimitrov

---

你也可以一行代码完成： npm i @react-three/fiber @react-three/drei - Brandon