Installation

• Getting Started
• React Three.js
• Universal AR

You can use this library by downloading a standalone zip containing the necessary files or by installing from NPM for use in a webpack project.

You can find the respective download links here.

NPM Webpack Module

Run the following NPM command inside your project directory:

$ npm install --save @zappar/zappar-react-three-fiber

We also expose a beta version of this package that contains recent tweaks and updates. To install, run the following NPM command inside your project directory:

npm install --save @zappar/zappar-react-three-fiber@beta

The beta version of the package is not recommended for live projects. We regularly update it which can lead to bugs. Please rigorously test across multiple devices and browsers if you are using this version of the package.

Then import the library into your JavaScript or TypeScript files:

import { ZapparCamera,  /* ... */ } from "@zappar/zappar-react-three-fiber";

The final step is to add this necessary entry to your webpack rules:

module.exports = {
  //...
  module: {
    rules: [
      //...
      {
        test: /zcv\.wasm$/,
        type: "javascript/auto",
        loader: "file-loader"
      }
      //...
    ]
  }
};