Necessary steps:

1. check imports in index.js file

import React from 'react';
import ReactDOM from 'react-dom/client';
import './index.css';
import App from './components/App';
import * as serviceWorkerRegistration from './serviceWorkerRegistration'; // required
import reportWebVitals from './reportWebVitals';

2. register serviceWorkerRegistration in index.js file

serviceWorkerRegistration.unregister() 
serviceWorkerRegistration.register()  // use this

3. check public folder structure:

4. configure manifest.json file

{
  "short_name": "React App",
  "name": "Create React App Sample",
  "icons": [
    {
      "src": "favicon.ico",
      "sizes": "64x64 32x32 24x24 16x16",
      "type": "image/x-icon"
    },
    {
      "src": "logo192.png",
      "type": "image/png",
      "sizes": "192x192",
      "purpose": "any maskable" // recommended for best PWA-optimization
    },
    {
      "src": "logo512.png",
      "type": "image/png",
      "sizes": "512x512"
    }
  ],
  "start_url": ".",
  "display": "standalone",
  "theme_color": "#000000",
  "background_color": "#ffffff"
}

5. press F12 -> Lighthouse -> Generate report

6. deploy build folder of your app to hosting

watch demo pwa-deploy-test