fully type checked example

package.json

@@ -41,11 +41,12 @@
         "lint": "eslint . --ext .ts"
     },
     "devDependencies": {
+        "@types/three": "^0.148.1",
         "@typescript-eslint/eslint-plugin": "^5.48.0",
         "@typescript-eslint/parser": "^5.48.0",
         "eslint": "^8.31.0",
         "three": "^0.148.0",
-        "typescript": "^5.0.3",
+        "typescript": "^5.5.0-beta",
         "vite": "^4.0.0",
         "vite-plugin-list-directory-contents": "^1.4.5"
     },

prototypes/_lib/gltf2parser.es.js

@@ -935,6 +935,7 @@ class Gltf2Parser {
     }
     return false;
   }
+  /** @param {string} url */
   static async fetch(url) {
     const res = await fetch(url);
     if (!res.ok)

prototypes/_lib/meshes/DynLineMesh.js

@@ -1,4 +1,4 @@
-import * as THREE from '@three';
+import * as THREE from 'three';
 
 class DynLineMesh extends THREE.LineSegments{
     _defaultColor   = 0x00ff00;

prototypes/_lib/meshes/ShapePointsMesh.js

@@ -1,4 +1,4 @@
-import * as THREE from '@three';
+import * as THREE from 'three';
 
 class ShapePointsMesh extends THREE.Points{
     _defaultShape   = 1;

prototypes/_lib/misc/GltfUtil.js

@@ -1,8 +1,8 @@
 // #region IMPORTS
-import * as THREE               from '@three';
+import * as THREE               from 'three';
 import { Armature, Clip, TrackVec3, TrackQuat } 
                                 from '../../../src/index';
-import Gltf2                    from '../gltf2Parser.es.js';
+import Gltf2                    from '../gltf2parser.es.js';
 // import MatrixSkinMaterial       from '../customSkinning/MatrixSkinMaterial.js';
 import MatrixSkinPbrMaterial    from '../customSkinning/MatrixSkinPbrMaterial.js';
 // #endregion
@@ -38,6 +38,7 @@ export default class GltfUtil{
     // #endregion
 
     // #region METHODS
+    /** @param {string} url */
     static async fetch( url ){ return await Gltf2.fetch( url ); }
 
     static filterNodes( gltf, props={} ){

prototypes/_lib/misc/Util.js

@@ -1,4 +1,4 @@
-import * as THREE   from '@three';
+import * as THREE   from 'three';
 import { Vec3 }     from '../../../src/index';
 
 export default class Util{

prototypes/_lib/useThreeWebGL2.js

@@ -1,6 +1,6 @@
 // #region IMPORTS
-import * as THREE           from '@three'; //'three';
-import { OrbitControls }    from '@OrbitControls'; //'three/examples/jsm/controls/OrbitControls.js';
+import * as THREE           from 'three';
+import { OrbitControls }    from 'three/examples/jsm/controls/OrbitControls.js';
 export { THREE };
 // #endregion
 
@@ -19,6 +19,7 @@ App
 
 
 // #region OPTIONS
+/** @param {ReturnType<typeof useThreeWebGL2>} tjs */
 export function useDarkScene( tjs, props={} ){
     const pp = Object.assign( { ambient:0x404040, grid:true, }, props );
 
@@ -156,6 +157,12 @@ export default function useThreeWebGL2( props={} ){
         };
     };
 
+    /**
+     * @param {number} lon
+     * @param {number} lat
+     * @param {number} radius
+     * @param {[number, number, number] | null} target
+     */
     const sphericalLook = ( lon, lat, radius, target=null )=>{
         const phi 	= ( 90 - lat )  * Math.PI / 180;
         const theta = ( lon + 180 ) * Math.PI / 180;