Typescript compiler error for refs with tresjs

[LBR474]

Describe the bug

I am using tresjs and would like to reference my newly loaded .glb and a directional light.
I should say, the page actually functions as expected, however the red squiggly line appears in my local VSCode with an error, and so would like to nail it down if possible.

Final note: this typescript compiler error only occurs on my local VSCode system, as can be seen from the StackBlitz link below, it doesn't occur there.
So I'm not sure if this is even a bug, but I'd like to ask for help to remove the red squiggly line from my local system, thanks if possible.

Reproduction

https://stackblitz.com/edit/vitejs-vite-qn7w4v

Steps to reproduce

I've tried changing the type of ref to a few things, eg: <THREE.DirectionalLight>, however nothing seems to remove this error:

(property) ref?: ((Ref<THREE.DirectionalLight> | Readonly<Ref<THREE.DirectionalLight>>) & VNodeRef) | undefined

System Info

Here is my package.json for that project:

{
  "name": "tresjs_1",
  "private": true,
  "version": "0.0.0",
  "type": "module",
  "scripts": {
    "dev": "vite",
    "build": "vue-tsc && vite build",
    "preview": "vite preview"
  },
  "dependencies": {
    "@tresjs/cientos": "^2.1.3",
    "@tresjs/core": "^2.1.2",
    
    "three": "^0.153.0",
    "three-stdlib": "^2.23.9",
    "vue": "^3.2.47"
  },
  "devDependencies": {
    
    "@types/three": "^0.152.1",
    "@vitejs/plugin-vue": "^4.1.0",
    "typescript": "^5.0.2",
    "vite": "^4.3.9",
    "vue-tsc": "^1.4.2"
  }
}

Used Package Manager

npm

Code of Conduct

• I agree to follow this project's Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• The provided reproduction is a minimal reproducible example of the bug.

[lausuarez02]

Hey @alvarosabu,
Would like to take this issue if you let me.
Cheers.

[alvarosabu]

@lausuarez02 sure thing, PR welcome 😊