[0.81.4]module-resolver alias "@" is not work #54100
Description
Description
When I use a relative path, everythings works fine. But when I use an alias path, the compiler throws an error in the terminal:
Steps to reproduce
- The directory structure is as follows:
-> % tree -L 2 -I node_modules
.
├── android
├── Gemfile
├── Gemfile.lock
├── ios
│ ├── App
│ ├── Boss.xcodeproj
│ ├── Boss.xcworkspace
│ ├── build
│ ├── Certificates
│ ├── fastlane
│ ├── Podfile
│ ├── Podfile.lock
│ ├── Pods
│ ├── PrivacyInfo.xcprivacy
│ └── Tools
├── metro.config.js
├── package.json
├── patches
│ └── react-native+0.81.4.patch
├── react-native
├── README.md
├── rn
│ ├── babel.config.js
│ ├── index.js
│ ├── jest.config.js
│ ├── specs
│ ├── src
│ └── tsconfig.json
├── vendor
│ └── bundle
└── yarn.lock
18 directories, 14 files
-> % cd rn
wuyukun@wuyukundeMacBook-Pro [16:07:59] [~/dev/jc-app-hybrid/rn] [dev *]
-> % tree -L 2 -I node_modules
.
├── babel.config.js
├── index.js
├── jest.config.js
├── specs
│ ├── AuthManagerModule.ts
│ └── NavigationManagerModule.ts
├── src
│ ├── App.tsx
│ ├── Navigation.tsx
│ ├── screens
│ ├── types
│ └── utils
└── tsconfig.json
6 directories, 8 files- babel.config.js
module.exports = {
presets: ["module:@react-native/babel-preset"],
plugins: [
[
"module-resolver",
{
root: ["./src"],
extensions: [".js", ".jsx", ".ts", ".tsx", ".json"],
alias: {
"@": "./src",
"@specs": "./specs",
},
},
],
],
env: {
production: {
plugins: ["react-native-paper/babel"],
},
},
};I tried removing root property and aslo treid replacing alias ./src with src, './src/*' and so on, but it still didn't work.
Both @and @specs didn't work either. I'm sure the config is correct if It is running on a web server, based on my experience with web projects
- tsconfig.json
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"@/*": ["src/*"],
"@specs/*": ["specs/*"]
}
},
"extends": "@react-native/typescript-config",
"include": ["**/*.ts", "**/*.tsx"],
"exclude": ["**/node_modules", "**/Pods"]
}
The import statement like import NavigationManagerModule from "@specs/NavigationManagerModule"; works fine in VS Code (the jump-to-definition feature works correctly).
React Native Version
0.81.4
Affected Platforms
Runtime - iOS
Output of npx @react-native-community/cli info
info Fetching system and libraries information...
System:
OS: macOS 15.6.1
CPU: (10) arm64 Apple M4
Memory: 215.83 MB / 16.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 20.19.4
path: ~/.nvm/versions/node/v20.19.4/bin/node
Yarn:
version: 1.22.22
path: ~/.nvm/versions/node/v20.19.4/bin/yarn
npm:
version: 10.8.2
path: ~/.nvm/versions/node/v20.19.4/bin/npm
Watchman:
version: 2025.08.25.00
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.16.2
path: /Users/wuyukun/.rbenv/shims/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 24.5
- iOS 18.5
- macOS 15.5
- tvOS 18.5
- visionOS 2.5
- watchOS 11.5
Android SDK: Not Found
IDEs:
Android Studio: Not Found
Xcode:
version: 16.4/16F6
path: /usr/bin/xcodebuild
Languages:
Java: Not Found
Ruby:
version: 3.3.5
path: /Users/wuyukun/.rbenv/shims/ruby
npmPackages:
"@react-native-community/cli": Not Found
react: Not Found
react-native: Not Found
react-native-macos: Not Found
npmGlobalPackages:
"*react-native*": Not Found
Android:
hermesEnabled: Not found
newArchEnabled: Not found
iOS:
hermesEnabled: true
newArchEnabled: true
info React Native v0.82.0 is now available (your project is running on v0.81.4).
info Changelog: https://github.com/facebook/react-native/releases/tag/v0.82.0
info Diff: https://react-native-community.github.io/upgrade-helper/?from=0.81.4&to=0.82.0
info For more info, check out "https://reactnative.dev/docs/upgrading?os=macos".
Stacktrace or Logs
ERROR Error: Unable to resolve module @specs/NavigationManagerModule from /Users/wuyukun/dev/jc-app-hybrid/rn/src/screens/AdminMembersScreen/index.tsx: @specs/NavigationManagerModule could not be found within the project or in these directories:
node_modules
4 |
5 | import AuthManagerModule from "../../../specs/AuthManagerModule";
> 6 | import NavigationManagerModule from "@specs/NavigationManagerModule";
| ^
7 |
8 | import ChipFilter, { TChipFilterOption } from "./ChipFilter";
9 | import MemberList from "./MemberList";
at ModuleResolver.resolveDependency (/Users/wuyukun/dev/jc-app-hybrid/node_modules/metro/src/node-haste/DependencyGraph/ModuleResolution.js:172:15)
at DependencyGraph.resolveDependency (/Users/wuyukun/dev/jc-app-hybrid/node_modules/metro/src/node-haste/DependencyGraph.js:252:43)
at /Users/wuyukun/dev/jc-app-hybrid/node_modules/metro/src/lib/transformHelpers.js:163:21
at resolveDependencies (/Users/wuyukun/dev/jc-app-hybrid/node_modules/metro/src/DeltaBundler/buildSubgraph.js:43:25)
at visit (/Users/wuyukun/dev/jc-app-hybrid/node_modules/metro/src/DeltaBundler/buildSubgraph.js:81:30)
at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
at async Promise.all (index 0)
at async buildSubgraph (/Users/wuyukun/dev/jc-app-hybrid/node_modules/metro/src/DeltaBundler/buildSubgraph.js:105:3)
at async Graph._buildDelta (/Users/wuyukun/dev/jc-app-hybrid/node_modules/metro/src/DeltaBundler/Graph.js:163:22)
at async Graph.traverseDependencies (/Users/wuyukun/dev/jc-app-hybrid/node_modules/metro/src/DeltaBundler/Graph.js:50:19)
MANDATORY Reproducer
Screenshots and Videos
No response