React snap is working perfect when running in localhost but in my remote server it is not working and also not giving any error

Question

After build and post build with react snap when I am trying to see if the meta tags are working properly or not by using chrome extension "localhost open graph debugger" and metatags.io website getting the perfect result but after uploading the result to the server it is not showing anything again back to normal before react snap in social media shares.

code of index.ts

import React from 'react';
import ReactDOM, { hydrate, render } from 'react-dom';
import './styles/index.css';
import App from './App';
import { Provider } from 'react-redux'
import store from './redux/store'
// ReactDOM.render(
//   <React.StrictMode>
//     <Provider store={store}>
//       <App />
//     </Provider>
//   </React.StrictMode>,
//   document.getElementById('root')
// );

const rootElement = document.getElementById("root");
if (rootElement?.hasChildNodes()) {
  hydrate(<React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>, rootElement);
} else {
  render(<React.StrictMode>
    <Provider store={store}>
      <App />
    </Provider>
  </React.StrictMode>, rootElement);
}

in package.json using

"scripts": { "start": "react-scripts start", "build": "react-scripts build", "test": "react-scripts test", "eject": "react-scripts eject", "postbuild": "react-snap" }, "reactSnap": { "skipThirdPartyRequests": true, "cacheAjaxRequests": true },

thanks.

Answer 1

Add the following section to your package.json:

"reactSnap": { "puppeteerArgs": [ "--no-sandbox", "--disable-setuid-sandbox" ] },