我正在尝试使用绝对导入路径而不是Expo和React Native的相对路径。
我查看了expo文档,找不到答案...在react社区中搜索主题时,我发现babel-plugin-module-resolver,但似乎Expo已在使用它,因此我更改了.babelrc来创建一些别名:
{
"presets": ["babel-preset-expo"],
"env": {
"development": {
"plugins": [
"transform-react-jsx-source",
["module-resolver", {
"root": ["./app"],
"alias": {
"Components": "./app/components",
}
}]
]
}
}
}
但我收到以下错误:
Unable to resolve module '@expo/vector-icons/glyphmaps/Entypo.json'
from '/Users/eduardoleal/Code/lua/rook/node_modules/@expo/vector-icons/Entypo.js':
Module does not exist in the module map or in these directories: /Users/eduardoleal/Code/lua/rook/node_modules/@expo/vector-icons/node_modules/@expo/vector-icons/glyphmaps , /Users/eduardoleal/Code/lua/rook/node_modules/@expo/vector-icons/glyphmaps This might be related to https://github.com/facebook/react-native/issues/4968 To resolve try the following:
1. Clear watchman watches: 'watchman watch-del-all'.
2. Delete the 'node_modules' folder: 'rm -rf node_modules && npm install'.
3. Reset packager cache: 'rm -fr $TMPDIR/react-*' or 'npm start --reset-cache'.
ABI16_0_0RCTFatal -[ABI16_0_0RCTBatchedBridge stopLoadingWithError:] __34-[ABI16_0_0RCTBatchedBridge start]_block_invoke_2 _dispatch_call_block_and_release _dispatch_client_callout _dispatch_main_queue_callback_4CF __CFRUNLOOP_IS_SERVICING_THE_MAIN_DISPATCH_QUEUE__ __CFRunLoopRun CFRunLoopRunSpecific GSEventRunModal UIApplicationMain main start 0x0
有什么简单的方法可以导入绝对路径?
最佳答案
更新:Expo v32.0.0及更高版本
Expo init正在为您创建一个“ babel.config.js”。只需将“ plugins”键添加到“ babel.config.js”文件并添加别名即可。不再需要'env'键。
module.exports = function(api) {
api.cache(true)
return {
presets: ['babel-preset-expo'],
plugins: [
[
'module-resolver',
{
alias: {
assets: './assets',
components: './src/components',
modules: './src/modules',
lib: './src/lib',
types: './src/types',
constants: './src/constants',
},
},
],
],
}
}
更新:Expo.io SDK v20.0.0的更改
从SDK v20.0.0开始,您可以使用常规的Babel Expo预设
{
"presets": ["babel-preset-expo"],
"env": {
"development": {
"plugins": ["transform-react-jsx-source"]
}
},
"plugins": [
["module-resolver", {
"alias": {
"alias-name": "./app",
}
}]
]
}
Expo.io SDK v19.0.0及更低版本
如果没有
root
元素,将plugins
分隔并将presets
更改为babel-preset-react-native-stage-0/decorator-support
,则别名对我有用。在16.0.0版上使用Expo.io
在以下世博论坛上找到此内容:https://forums.expo.io/t/relative-paths-with-expo/654/3
您能否验证这也适用于您的情况?
{
"presets": ["babel-preset-react-native-stage-0/decorator-support"],
"env": {
"development": {
"plugins": ["transform-react-jsx-source"]
}
},
"plugins": [
["module-resolver", {
"alias": {
"alias-name": "./app",
}
}]
]
}
关于react-native - 如何在Expo和React Native中使用绝对路径导入?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/43681091/