Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker for scope

FirebaseError: Messaging: We are unable to register the default service worker. Failed to register a ServiceWorker for scope with script: ServiceWorker script evaluation failed (messaging/failed-service-worker-registration).

I get this error in production. In local chrome browser, it is perfectly working. I made sure that I stored firebase-messaging-sw.js file in public folder. What is wrong, any idea?

My firebase-messaging-sw.js file is as follows

'use strict';

importScripts("https://www.gstatic.com/firebasejs/9.6.3/firebase-app.js");
importScripts("https://www.gstatic.com/firebasejs/9.6.3/firebase-messaging.js");

const FIREBASE_CONFIG = {
    apiKey: "",
    authDomain: "",
    projectId: "",
    databaseURL: "",
    storageBucket: "",
    messagingSenderId: "",
    appId: "",
    measurementId: ""
};

// Initialize the firebase in the service worker.
firebase.initializeApp(FIREBASE_CONFIG);

self.addEventListener('push', function (event) {
    var data = event.data.json();

    const title = data.Title;
    data.Data.actions = data.Actions;
    const options = {
        description: data.description,
        data: data.Data
    };
    event.waitUntil(self.registration.showNotification(title, options));
});

self.addEventListener('notificationclick', function (event) { });

self.addEventListener('notificationclose', function (event) { });

messaging.onBackgroundMessage(function (payload) {
    console.log("Received background message ", payload);

    const notificationTitle = payload.notification.title;
    const notificationOptions = {
        description: payload.notification.description,
        icon: "/favicon-96x96.png",
    };

    // eslint-disable-next-line no-restricted-globals
    return self.registration.showNotification(
        notificationTitle,
        notificationOptions
    );
});