In my babel.config.js, I had to remove the commented line because I ran into an error when doing the build, which said that module-resolver was not found.
babel config.js

module.exports = function(api) {
  api.cache(false);  return {
    presets: ['babel-preset-expo'],
    plugins: [
      ------------------> remove this commented lines <-----------------------
      // [ 
      //   'module-resolver',
      //   {
      //     extensions: ['.js', '.jsx', '.ts', '.tsx', '.json'],
      //     root: ['.'],
      //     alias: {
      //       '@src': './src',
      //       '@dev': './dev',
      //       '@tests': './tests',
      //     },
      //   },
      // ],
      '@babel/plugin-transform-named-capturing-groups-regex',
      'lodash',
    ],
  };
};

After some digging, I have removed it because I found here and here that we no longer require the module-resolver in Expo SDK 50, and it supports TypeScript path aliases out of the box.
in tsconfig.json I have this path alise configured like this

"baseUrl": ".",
"paths": {
   "@src/*": ["src/*"],
},

and here is my merto.config.js config looks like below

const { getSentryExpoConfig } = require('@sentry/react-native/metro');
const path = require('path');

const projectRoot = __dirname;
const workspaceRoot = path.resolve(projectRoot, '../../../');

const config = getSentryExpoConfig(projectRoot);

config.watchFolders = [workspaceRoot];
config.resolver.disableHierarchicalLookup = true;
config.resolver.nodeModulesPaths = [
  path.resolve(projectRoot, 'node_modules'),
  path.resolve(workspaceRoot, 'node_modules'),
];

config.resolver.sourceExts = ['js', 'jsx', 'ts', 'tsx', 'json'];

config.transformer.inlineRequires = true;

module.exports = config;

After all this, still when I try to run the app, it says can’t resolve the modules. Please note that I am working on a monorepo.