However, this package itself specifies a `main` module field that could not be resolved

After a long research MetroJS bundler default not compile .ts and .tsx extension files we need tell MetroJS bundler to compiles .ts and .tsx files i solved this error by edit metro.config.js file in root project folder by following

module.exports = {

  resolver: {
   sourceExts: ['jsx','js','ts','tsx'] //add here 
  },
};

here is how my metro.config.js it looks like after configuring. i am using react-navigato 5*

    module.exports = {
        transformer: {
          getTransformOptions: async () => ({
             transform: {
                experimentalImportSupport: false,
                inlineRequires: false,
             },
           }),
         },
          /** include this below (remove this comment too)*/
       resolver: {                              
         sourceExts: ['jsx', 'js', 'ts', 'tsx'],
       },
   };