Tresjs / cientos

Collection of useful helpers and fully functional, ready-made abstractions for TresJS
https://cientos.tresjs.org/
MIT License
278 stars 40 forks source link

`Levioso` and `MouseParallax` are not working in development environment #369

Closed stefanobartoletti closed 6 months ago

stefanobartoletti commented 6 months ago

Describe the bug

I have a strange problem with one of my projects, I'm not really sure if it is a bug or just something wrong on my side.

I've implemented a 3D Scene that includes some composables from Cientos, namely: Text3D, Levioso and MouseParallax. I'm using them in a Nuxt project, all packages are updated to the latest verisons.

Short version: Levioso and MouseParallax are not working on the site frontend in the development environment (when running pnpm dev) but they work correctly in the built static site (when running pnpm generate && pnpm preview)

Long version: I already tested this setup before, and everything was working correctly, even in the development environment. You can see the final scene here https://tresjs-playground.vercel.app/3d-text and this is its source https://github.com/stefanobartoletti/tresjs-playground/blob/main/pages/3d-text.vue

This is not where the problem occurs, this demo is working fine also in the dev env: I tried to replicate this configuration in another project (that I can't share publicly at the moment), and I have the problem described before. From what I understand, both Levioso and 'MouseParallax` do not need some specific setup, at least the documentation does not specify special use cases that may require special configuration.

No errors or other messages are sent to the console, both in the browser and in the terminal where I launched the dev server. The only clue is that these animations are just not working in the development environment.

I'm not sure if this is enough to get some help, I understand that there are not many info here. But I am puzzled by eh fact that the same setup works in one project and noting another.

Reproduction

https://github.com/stefanobartoletti/tresjs-playground/blob/main/pages/3d-text.vue

Steps to reproduce

No response

System Info

System:
    OS: Linux 6.8 openSUSE Tumbleweed 20240320
    CPU: (16) x64 AMD Ryzen 7 4800H with Radeon Graphics
    Memory: 6.68 GB / 15.04 GB
    Container: Yes
    Shell: 5.2.26 - /bin/bash
  Binaries:
    Node: 18.19.0 - ~/.nvm/versions/node/v18.19.0/bin/node
    npm: 10.2.3 - ~/.nvm/versions/node/v18.19.0/bin/npm
    pnpm: 8.15.4 - ~/.nvm/versions/node/v18.19.0/bin/pnpm
  npmPackages:
    @tresjs/cientos: ^3.8.0 => 3.8.0 
    @tresjs/nuxt: ^2.1.1 => 2.1.1 
    nuxt: ^3.11.1 => 3.11.1 
    three: ^0.162.0 => 0.162.0

Used Package Manager

pnpm

Code of Conduct

andretchen0 commented 6 months ago

Hey Stefano,

Please ask on the discord. Please include details of the non-working setup.

I'm going to close here: can't replicate.