Issue with Tesnorflow JS Face Detection on Production

[mirzamukkarambaig]

I am creating a React JS-based front end that employs the Tensorflow JS Simple Face Detection model. The application runs fine when being run on the dev environment using npm run dev. However when I run npm run build and npm run preview the model throws the following error:
index-BEYgabte.js:15635 Uncaught (in promise) TypeError: Zse.FaceDetection is not a constructor at new t (index-BEYgabte.js:15635:1827) at index-BEYgabte.js:15635:3968 at index-BEYgabte.js:15635:1457 at Object.next (index-BEYgabte.js:15635:1562) at index-BEYgabte.js:15635:499 at new Promise (<anonymous>) at l0 (index-BEYgabte.js:15635:250) at SEe (index-BEYgabte.js:15635:3683) at index-BEYgabte.js:15635:15604 at index-BEYgabte.js:15635:1457

This is the picture of the preview

This is the picture of the dev

[mirzamukkarambaig]

Please find the code below:
`// Import necessary libraries
import '@mediapipe/face_detection';
import '@tensorflow/tfjs-core';
// Register WebGL backend.
import '@tensorflow/tfjs-backend-webgl';
import * as faceDetection from '@tensorflow-models/face-detection';
import * as cocoSsd from '@tensorflow-models/coco-ssd';

export const createFaceDetector = async () => {
// Define the model from SupportedModels
const model = await faceDetection.SupportedModels.MediaPipeFaceDetector;

// Define the detector configuration
const detectorConfig = {
    runtime: 'mediapipe', // Set runtime to 'mediapipe'
    maxFaces: 2,          // Set to detect up to 2 faces
    modelType: 'full',    // Use the full-range model
    solutionPath: 'https://cdn.jsdelivr.net/npm/@mediapipe/face_detection', // Path to the solution
};

try {
    console.log('Initializing face detector...');
    // Create the detector
    const detector = await faceDetection.createDetector(model, detectorConfig);
    console.log('Face detector initialized');
    if (!detector) throw new Error('Face detector not created');
    return detector;
} catch (error) {
    console.error('Face detector loading error:', error);
    throw error;
}

};`

[SuryanarayanaY]

Hi @mirzamukkarambaig ,

For TensorFlow JS we have separate repo. Please report JS issues there. Link attached for reference.

Thanks!

[mirzamukkarambaig]

Great Thank you

[google-ml-butler]

Are you satisfied with the resolution of your issue?
Yes
No