@tresjs/nuxt

Official Nuxt module for TresJS. Build 3D scenes as they were Vue components.

• ✨  Release Notes
• 📖  Documentation

Features

• 🤓 Auto-import components and composables from the TresJS ecosystem
• TresCanvas client only, you don't need to add .client to the component name or <ClientOnly />
• Automatically configures vue compiler to support TresJS components, see why?
• All the DX Magic that comes with Nuxt ✨

Quick Setup

1. Add @tresjs/nuxt dependency to your project

# Using pnpm
pnpm add @tresjs/nuxt

# Using yarn
yarn add @tresjs/nuxt

# Using npm
npm install @tresjs/nuxt

2. Add @tresjs/nuxt to the modules section of nuxt.config.ts

export default defineNuxtConfig({
  modules: ["@tresjs/nuxt"],
});

That's it! You can now use @tresjs/nuxt in your Nuxt app ✨

If you want to use the any package from the TresJS ecosystem, you can install the packages you want to use and they will be auto-imported by the module 🧙🏼‍♂️.

# Using pnpm
pnpm add @tresjs/cientos @tresjs/post-processing

Development

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release