tresjs
Go to documentationCreate 3D experiences in your Nuxt application using TresJS.
@tresjs/nuxt
Official Nuxt module for TresJS. Build 3D scenes as they were Vue components.
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
- 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
- Add
@tresjs/nuxt
to themodules
section ofnuxt.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