react-three-next

[vieyahn2017]

https://github.com/pmndrs/react-three-next/tree/main

[vieyahn2017]

React-Three-Next starter

A minimalist starter for NextJS, @react-three/fiber and Threejs.

[vieyahn2017]

React Three Fiber 是一个基于 React 的三维渲染库，它可以让你使用 React 组件的方式来创建 Three.js 应用。它提供了类似于 React 组件的 API 来创建三维场景中的对象，如相机、灯光、几何体等。

使用 React Three Fiber 需要先安装它和 Three.js 依赖，然后在你的项目中引入它。

import { Canvas } from 'react-three-fiber'

在你的 JSX 中使用 组件来创建一个 Three.js 场景。

<Canvas>
  <ambientLight />
  <pointLight position={[10, 10, 10]} />
  <mesh>
    <boxGeometry />
    <meshStandardMaterial />
  </mesh>
</Canvas>

然后就可以在 <Canvas> 中使用其它的组件来创建三维场景中的对象，如相机、灯光、几何体等。

[vieyahn2017]

https://github.com/pmndrs/react-three-fiber

[vieyahn2017]

react-three-fiber实现3D粒子效果 https://juejin.cn/post/7136004778865197064