The responses provided by others were quite helpful, but did not completely align with my specific needs for applying a recurring patterned texture to all sides of a shape primarily consisting of flat surfaces. One challenge encountered was the occurrence of distorted textures on vertical surfaces due to solely utilizing the x and y components as u and v.

In my approach detailed below, I leverage surface normals to determine which two components (x, y, and z) should be allocated to u and v. Although this method is fairly rudimentary, it functions effectively.

function assignUVs(geometry) {

    geometry.faceVertexUvs[0] = [];

    geometry.faces.forEach(function(face) {

        var components = ['x', 'y', 'z'].sort(function(a, b) {
            return Math.abs(face.normal[a]) > Math.abs(face.normal[b]);
        });

        var v1 = geometry.vertices[face.a];
        var v2 = geometry.vertices[face.b];
        var v3 = geometry.vertices[face.c];

        geometry.faceVertexUvs[0].push([
            new THREE.Vector2(v1[components[0]], v1[components[1]]),
            new THREE.Vector2(v2[components[0]], v2[components[1]]),
            new THREE.Vector2(v3[components[0]], v3[components[1]])
        ]);

    });

    geometry.uvsNeedUpdate = true;
}

This function does not standardize the UVs based on the object's size. However, it proves more effective when incorporating the same texture on objects of varying dimensions within the scene. Depending on the scale of your world coordinate system, adjustments to scaling and repetition of the texture may be required:

texture.repeat.set(0.1, 0.1);
texture.wrapS = texture.wrapT = THREE.MirroredRepeatWrapping;

Understanding box UV mapping is crucial when working with three.js configurators for various applications. If you want to see it in action, check out this example.

This solution can handle both indexed and non-indexed buffer geometries on a per-face basis.

https://i.sstatic.net/iTi57.png

For reference, here's how you can utilize this technique:

// Create a mesh
var bufferGeometry = new THREE.BufferGeometry().fromGeometry(new THREE.DodecahedronGeometry(2.5, 0));
let material = new THREE.MeshPhongMaterial({
    color: 0x10f0f0,
    map: new THREE.TextureLoader().load('http://mbnsay.com/rayys/images/1K_UV_checker.jpg')
});

// Determine dimensions for optimal texture sizing without distortion
bufferGeometry.computeBoundingBox();
let bboxSize = bufferGeometry.boundingBox.getSize();
let uvMapSize = Math.min(bboxSize.x, bboxSize.y, bboxSize.z);

// Calculate UV coordinates (will add attribute if not present)
applyBoxUV(bufferGeometry, new THREE.Matrix4().getInverse(cube.matrix), uvMapSize);

// Notify three.js about the update
bufferGeometry.attributes.uv.needsUpdate = true;

The code above relies on the implementation of applyBoxUV shown below:

function _applyBoxUV(geom, transformMatrix, bbox, bbox_max_size) {
    // Implementation logic here 
}

function applyBoxUV(bufferGeometry, transformMatrix, boxSize) {
    // Implementation logic here 
}

I found the solutions provided here to be incredibly helpful. There is one key point that stood out to me: when updating vertices, it's important to set uvs rather than re-assign them within the scope of my geometry:

scope.updateUVs = (copy=true) => {

    scope.computeBoundingBox();

    var max     = scope.boundingBox.max;
    var min     = scope.boundingBox.min;

    var offset  = new THREE.Vector2(0 - min.x, 0 - min.y);
    var range   = new THREE.Vector2(max.x - min.x, max.y - min.y);

    if (!copy) {
        scope.faceVertexUvs[0] = [];
    }
    var faces = scope.faces;

    for (i = 0; i < scope.faces.length ; i++) {

      var v1 = scope.vertices[faces[i].a];
      var v2 = scope.vertices[faces[i].b];
      var v3 = scope.vertices[faces[i].c];

      var uv0 = new THREE.Vector2( ( v1.x + offset.x ) / range.x , ( v1.y + offset.y ) / range.y );
      var uv1 = new THREE.Vector2( ( v2.x + offset.x ) / range.x , ( v2.y + offset.y ) / range.y );
      var uv2 = new THREE.Vector2( ( v3.x + offset.x ) / range.x , ( v3.y + offset.y ) / range.y );

      if (copy) {
          var uvs =scope.faceVertexUvs[0][i];
          uvs[0].copy(uv0);
          uvs[1].copy(uv1);
          uvs[2].copy(uv2);
      } else {
          scope.faceVertexUvs[0].push([uv0, uv1, uv2]);
      }
    }

    scope.uvsNeedUpdate = true;

}

This code snippet provides a general solution for spherical mapping using yaw and pitch coordinates. Take a look at the example here (specifically the loadSuzanne function):

function assignUVs(geometry) {

    geometry.faceVertexUvs[0] = [];

    geometry.faces.forEach(function(face) {

        var uvs = [];
        var ids = [ 'a', 'b', 'c'];
        for( var i = 0; i < ids.length; i++ ) {
            var vertex = geometry.vertices[ face[ ids[ i ] ] ].clone();

            var n = vertex.normalize();
            var yaw = .5 - Math.atan( n.z, - n.x ) / ( 2.0 * Math.PI );
            var pitch = .5 - Math.asin( n.y ) / Math.PI;

            var u = yaw,
                v = pitch;
            uvs.push( new THREE.Vector2( u, v ) );
        }
        geometry.faceVertexUvs[ 0 ].push( uvs );
    });

    geometry.uvsNeedUpdate = true;
}