React Native+TypeScript自定义组件导入报错：无法解析模块

导入自定义组件时出现如下报错：

error: Error: Unable to resolve module screens/BulletinScreen from C:\Development_Projects\atlas\src\navigation\AppNavigator.tsx: screens/BulletinScreen could not be found within the project or in these directories:
  node_modules
   6 | import {NavigationContainer} from '@react-navigation/native';
   7 | import React from 'react';
>  8 | import BulletinScreen from 'screens/BulletinScreen';
     |                             ^
   9 | import StudyInfoScreen from 'screens/StudyInfoScreen';
  10 | import BottomTabBar from './components/BottomTabBar';
  11 | import screenKey from './ScreenKey';

以下是我的babel.config.js配置：

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],

  plugins: [
    [
      'module-resolver',
      {
        root: ['./'],
        alias: {
          assets: './src/assets',
          components: './src/components',
          navigation: './src/navigation',
          redux: './src/redux',
          screens: './src/screens',
          types: './src/types',
          utils: './src/utils',
        },
      },
    ],
  ],
};

以及tsconfig.json配置：

{
  "extends": "@tsconfig/react-native/tsconfig.json",
  "compilerOptions": {
    "baseUrl": ".",
    "paths": {
      "assets/*": ["./src/assets/*"],
      "components/*": ["./src/components/*"],
      "navigation/*": ["./src/navigation/*"],
      "redux/*": ["./src/redux/*"],
      "screens/*": ["./src/screens/*"],
      "types/*": ["./src/types/*"],
      "utils/*": ["./src/utils/*"]
    },
    "typeRoots": ["@types", "node_modules/@types"],
    "skipLibCheck": true
  },
  "include": ["./src", "App.tsx"]
}

恳请各位提供帮助。

内容的提问来源于stack exchange，提问作者Huan Huynh