Pesquisa de site

typescript - Não é possível resolver o módulo em aplicativo React Native Expo


Estou usando 'babel-plugin-root-import' e TypeScript para configurar o caminho absoluto.

Quando estou tentando importar arquivos do diretório raiz com import {Config} from "~/Config/Config", aparece "Não é possível resolver o módulo".

Unable to resolve module ./src/Config/Config from D:\project\src\api\mos-api\fetchMosDataAsync.ts:

Nenhum desses arquivos existe:

  • src\api\mos-api\src\Config\Config(.native|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)
  • src\api\mos-api\src\Config\Config\index(.native|.ios.ts|.native.ts|.ts|.ios.tsx|.native.tsx|.tsx|.ios.js|.native.js|.js|.ios.jsx|.native.jsx|.jsx|.ios.json|.native.json|.json)

De alguma forma, o TypeScript ou o Babel concatenam caminhos, mas não os tornam absolutos. O que estou fazendo de errado ou talvez estou esquecendo algumas dependências?

package.json

"dependencies": {
    "@babel/runtime": "^7.20.7",
    "@expo/vector-icons": "^13.0.0",
    "@react-native-async-storage/async-storage": "~1.17.3",
    "@react-native-community/datetimepicker": "6.1.2",
    "@react-navigation/bottom-tabs": "^6.3.1",
    "@react-navigation/native": "^6.0.10",
    "@react-navigation/stack": "^6.2.2",
    "babel": "^6.23.0",
    "expo": "~45.0.0",
    "expo-font": "latest",
    "expo-linear-gradient": "~11.3.0",
    "expo-network": "~4.2.0",
    "expo-status-bar": "~1.3.0",
    "expo-updates": "~0.13.4",
    "html-entities": "^2.3.3",
    "lodash": "^4.17.21",
    "react": "17.0.2",
    "react-dom": "17.0.2",
    "react-native": "0.68.2",
    "react-native-app-intro-slider": "^4.0.4",
    "react-native-gesture-handler": "~2.2.1",
    "react-native-modal-datetime-picker": "^13.1.2",
    "react-native-reanimated": "~2.8.0",
    "react-native-safe-area-context": "4.2.4",
    "react-native-screens": "~3.11.1",
    "react-native-svg": "12.3.0",
    "react-native-web": "0.17.7"
  },
  "devDependencies": {
    "@babel/core": "^7.12.9",
    "@types/lodash": "^4.14.182",
    "@types/react": "~17.0.21",
    "@types/react-native": "~0.66.13",
    "babel-plugin-root-import": "^6.6.0",
    "typescript": "^4.8.4"
  },

babel.config.js

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

tsconfig.json

{
"extends": "expo/tsconfig.base",
"compilerOptions": {
  "strict": true,
  "baseUrl": "src",
  "rootDir": "src",
  "paths": {
    "~/*": ["*"]
  }
}