Relative imports are not working, but absolute imports function correctly after React Native upgrade 0.76.3.

[ciplnaveen]

Description

After upgrading my React Native project, I've encountered an issue where relative imports no longer work, while absolute imports function as expected. This problem affects various modules, including components and utilities within the src directory.

Steps to reproduce

This is my structure for dialog

src/components/dialogs/index.ts
index.ts imports all the different dialogs and export them, so that other components can use them.

**index.ts**
import MyDialog from 'src/components/dialogs/myDialog/MyDialog';
export {
    MyDialog
}

src/components/index.ts
index.ts imports all the dialogs, inputs, buttons and etc then exports them

**index.ts**
import MyDialog from './dialogs';
export { 
    MyDialog, ---> This doesn't work if I import like this
    OtherDialogs...
}

import MyDialog from 'src/components/dialogs/myDialog/MyDialog'; ---> This works

I have no clue why it started braking after the upgrade.

This is babel.config.js

module.exports = {
  presets: ['module:@react-native/babel-preset'],
  plugins: [
    [
      'module-resolver',
      {
        root: ['./src'],
        alias: {
          src: './src',
        },
      },
    ],
    [
      'module:react-native-dotenv',
      {
        moduleName: '@env',
        path: '.env',
      },
    ],
    'react-native-reanimated/plugin',
  ],
};

This is tsconfig.json

{
  "extends": "@react-native/typescript-config/tsconfig.json",
  "compilerOptions": {
    "baseUrl": "." /* Base directory to resolve non-absolute module names. */,
    "paths": {
      "src/*": ["src/*"]
    },
    "types": ["@types/styled-components-react-native"]
  }
}

React Native Version

0.76.3

Affected Platforms

Runtime - iOS

Areas

Fabric - The New Renderer

Output of npx react-native info

System:
  OS: macOS 15.1.1
  CPU: (12) arm64 Apple M3 Pro
  Memory: 721.78 MB / 36.00 GB
  Shell:
    version: "5.9"
    path: /bin/zsh
Binaries:
  Node:
    version: 20.18.1
    path: ~/.nvm/versions/node/v20.18.1/bin/node
  Yarn:
    version: 3.6.4
    path: ~/.nvm/versions/node/v20.18.1/bin/yarn
  npm:
    version: 10.8.2
    path: ~/.nvm/versions/node/v20.18.1/bin/npm
  Watchman:
    version: 2024.11.18.00
    path: /opt/homebrew/bin/watchman
Managers:
  CocoaPods:
    version: 1.16.2
    path: /opt/homebrew/bin/pod
SDKs:
  iOS SDK:
    Platforms:
      - DriverKit 24.1
      - iOS 18.1
      - macOS 15.1
      - tvOS 18.1
      - visionOS 2.1
      - watchOS 11.1
  Android SDK: Not Found
IDEs:
  Android Studio: 2024.2 AI-242.23339.11.2421.12550806
  Xcode:
    version: 16.1/16B40
    path: /usr/bin/xcodebuild
Languages:
  Java:
    version: 17.0.10
    path: /Library/Java/JavaVirtualMachines/jdk-17.jdk/Contents/Home/bin/javac
  Ruby:
    version: 2.6.10
    path: /usr/bin/ruby
npmPackages:
  "@react-native-community/cli":
    installed: 15.0.1
    wanted: 15.0.1
  react:
    installed: 18.3.1
    wanted: 18.3.1
  react-native:
    installed: 0.76.3
    wanted: 0.76.3
  react-native-macos: Not Found
npmGlobalPackages:
  "*react-native*": Not Found
Android:
  hermesEnabled: true
  newArchEnabled: true
iOS:
  hermesEnabled: true
  newArchEnabled: true

Stacktrace or Logs

Warning: TypeError: Cannot read property 'MyDialog' of undefined

Reproducer

I couldn't push on the repo https://github.com/ciplnaveen/react-native-import

Screenshots and Videos

No response