Introduction

Useful helpers for @react-three/fiber

Summary

A growing collection of useful helpers and fully functional, ready-made abstractions for @react-three/fiber.

logo

Version Downloads Discord Shield Open in GitHub Codespaces

If you make a component that is generic enough to be useful to others, think about CONTRIBUTING!

npm install @react-three/drei
Important

this package is using the stand-alone three-stdlib instead of three/examples/jsm.

Basic usage

import { PerspectiveCamera, PositionalAudio, ... } from '@react-three/drei'

React-native

import { PerspectiveCamera, PositionalAudio, ... } from '@react-three/drei/native'

The native route of the library does not export Html or Loader. The default export of the library is web which does export Html and Loader.

INSTALL

& corepack enable
$ yarn install

Tests

To run visual tests in the same environment as the CI:

$ yarn build
$ docker run --init --rm -v $(pwd):/app -w /app ghcr.io/pmndrs/playwright:main yarn test
Tip

If running on mac m-series, you may need to add --platform linux/arm64 to the docker command.

To update a snapshot, simply remove it and relaunch the test command.