我使用 expo typescript 模板创建了一个项目。在 iOS 和 Android 上运行。没有网络。
然后我在 tsconfig.json
中设置路径别名如下:
"paths": {
"@models/*": ["./src/models/*"],
"@navigation/*": ["./src/navigation/*"],
"@services/*": ["./src/services/*"],
"@components/*": ["./tsx/components/*"],
"@screens/*": ["./tsx/screens/*"],
"@assets/*": ["./assets/*"]
}
相应地,我配置了
babel.config.js
如下:plugins: [
[
'module-resolver',
{
root: ['./'],
alias: {
'@models': path.resolve(path.dirname('.'), 'src/models'),
'@navigation': path.resolve(path.dirname('.'), 'src/navigation'),
'@services': path.resolve(path.dirname('.'), 'src/services'),
'@screens': path.resolve(path.dirname('.'), 'tsx/screens'),
'@components': path.resolve(path.dirname('.'), 'tsx/components'),
'@assets': path.resolve(path.dirname('.'), 'assets'),
}
}
]
]
上述配置有效。应用程序 bundle 并运行良好。但是,在 bundle 过程中会发出以下非严重错误:
transform[stderr]: Could not resolve "/Users/jblues/mobbiz/LOSMobileApp/src/navigation/AppNavigator" in file /Users/jblues/LOSMobileApp/tsx/App.tsx.
transform[stderr]: Could not resolve "/Users/jblues/LOSMobileApp/tsx/components/BottomTabNavigator" in file /Users/jblues/LOSMobileApp/src/navigation/AppNavigator.ts.
transform[stderr]: Could not resolve "/Users/jblues/mobbiz/LOSMobileApp/tsx/screens/Login" in file /Users/jblues/LOSMobileApp/src/navigation/AppNavigator.ts.
. .等等。有什么可以添加到我的配置中来防止这些错误的吗?
最佳答案
您缺少扩展配置,例如:
extensions: ['.js', '.ts', '.ios.js', '.ios.ts', '.android.js', '.android.ts', '.json'],
这是
babel.config.js
我拥有的文件,它可以正常工作。它可能对您的引用有用。const MODULE_RESOLVER = [
'module-resolver',
{
extensions: ['.js', '.ios.js', '.android.js', '.json'],
alias: {
'@Components': './App/Components',
'@Navigation': './App/Navigation',
'@Constants': './App/Constants',
'@Features': './App/Features',
'@Services': './App/Services',
'@Fixtures': './App/Fixtures',
'@Themes': './App/Themes',
'@Config': './App/Config',
'@Sagas': './App/Sagas',
'@Redux': './App/Redux',
'@Types': './App/Types',
'@I18n': './App/I18n',
'@Lib': './App/Lib',
},
},
];
module.exports = {
plugins: [MODULE_RESOLVER],
presets: ['module:metro-react-native-babel-preset'],
env: {
production: {
plugins: ['ignite-ignore-reactotron', MODULE_RESOLVER],
},
},
};
关于android - 使用模块解析器时的 Metro bundler 错误,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60167449/