我无法从世博会反应中的 src 文件夹导入

Question

我正在使用expo-cli。

我从文件夹"src"中导入了一个模块(我创建了这个文件夹(，如果在web中打开，这可以很好地工作，但如果在android中打开，则找不到这个。

我尝试使用绝对路径，Babel Resolver模块，但什么都不起作用。

项目：

-assets
-node_modules
-src
-components
-screens
-HomeScreen.js
-services
-Webservices.js
-styles
-utils
-App.js
...

屏幕文件：

...
import WebServices from '../services/WebServices';
export default class HomeScreen extends React.Component {
...

要导入的文件：

const axios = require('axios');
var url = 'https://randomuser.me/api/';
var WebServices = {
getUser: function(){
return axios.get(url);
} 
}
export { WebServices as default };

错误：

Android Bundling failed 5347ms
Unable to resolve module ../services/WebServices.js from C:UsersjalvarezProyectosAppPruebassrcscreensHomeScreen.js:
None of these files exist:
* srcservicesWebServices.js(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
* srcservicesWebServices.jsindex(.native|.android.ts|.native.ts|.ts|.android.tsx|.native.tsx|.tsx|.android.js|.native.js|.js|.android.jsx|.native.jsx|.jsx|.android.json|.native.json|.json)
5 | import { createNativeStackNavigator } from '@react-navigation/native-stack';
6 |
>  7 | import WebServices from '../services/WebServices.js';
|                          ^
8 |
9 | export default class HomeScreen extends React.Component {

在此处输入图像描述

Answer 1

安装Typescript和babel插件根导入模块，并在babel.config.js和tsconfig.json中使用此配置，适用于android和web。

balbel.config.js:

module.exports = function(api) {
api.cache(true);
return {
presets: ['babel-preset-expo'],
plugins: [
[
'babel-plugin-root-import',
{
root: __dirname,
rootPathPrefix: '~',
rootPathSuffix: './src',
},
]
]
};
};

在tsconfig.json中添加：

"rootDir": "./"

进口：

import WebServices from '~/services/webservices';