mrdoob/three.js · error

THREE.MathUtils: Invalid component type.

Error message

THREE.MathUtils: Invalid component type.

What it means

Thrown by MathUtils.denormalize(value, array) when array.constructor is not one of the supported TypedArray constructors (Float32Array, Uint32Array, Uint16Array, Uint8Array, Int32Array, Int16Array, Int8Array). denormalize converts a raw integer stored in a typed array back to a float in [0,1] or [-1,1]; only the listed types have a defined scale factor.

Source

Thrown at src/math/MathUtils.js:422

		case Uint8Array:

			return value / 255.0;

		case Int32Array:

			return Math.max( value / 2147483647.0, - 1.0 );

		case Int16Array:

			return Math.max( value / 32767.0, - 1.0 );

		case Int8Array:

			return Math.max( value / 127.0, - 1.0 );

		default:

			throw new Error( 'THREE.MathUtils: Invalid component type.' );

	}

}

/**
 * Normalizes the given value according to the given typed array.
 *
 * @param {number} value - The float value in the range `[0,1]` to normalize.
 * @param {TypedArray} array - The typed array that defines the data type of the value.
 * @return {number} The normalize value.
 */
function normalize( value, array ) {

	switch ( array.constructor ) {

		case Float32Array:

View on GitHub (pinned to da05705fa3)

Solutions

1. Pass a standard TypedArray instance (Float32Array, Uint8Array, Int16Array, etc.), not a plain Array.
2. If you have a plain array, convert first: new Float32Array(plainArray).
3. Avoid BigInt64Array/BigUint64Array for attributes that go through denormalize; use a supported 8/16/32-bit type.
4. If you sub-classed a TypedArray, pass the underlying base TypedArray instance instead.

Example fix

// before: passing a plain array
const v = THREE.MathUtils.denormalize(128, [0,128,255]); // throws

// after: use a supported TypedArray
const v = THREE.MathUtils.denormalize(128, new Uint8Array([0,128,255]));

const SUPPORTED = [Float32Array, Uint32Array, Uint16Array, Uint8Array, Int32Array, Int16Array, Int8Array];

function isDenormalizable(array) {
  return SUPPORTED.some(T => array instanceof T || array.constructor === T);
}

if (!isDenormalizable(array)) array = new Float32Array(array);

function isSupportedTypedArray(array) {
  const T = array && array.constructor;
  return [Float32Array, Uint32Array, Uint16Array, Uint8Array, Int32Array, Int16Array, Int8Array].includes(T);
}

When it happens

Trigger: Calling THREE.MathUtils.denormalize(value, array) with a plain Array, a BigInt64Array/BigUint64Array, a DataView, or a sub-classed TypedArray whose constructor differs. Also passing an array whose buffer was transferred/sliced such that constructor identity is unexpected (rare).

Common situations: Morph-target or attribute compression code that passes the raw JS array instead of the TypedArray. Custom typed-array subclasses. Using 64-bit integer arrays which denormalize does not support.

Related errors

• THREE.BufferAttribute: array should be a Typed Array.
• THREE.CubeCamera.updateCoordinateSystem(): Invalid coordinat
• Unable to determine texture byte length for ${format} format
• THREE.TextureUtils: Unknown texture type ${type}.
• THREE.CameraHelper.update(): Invalid coordinate system: ${th

AI-assisted analysis of mrdoob/three.js@da05705fa3 (2026-08-12). Data as JSON: /api/errors/48de8d8f27488cf6. Report an issue: GitHub.