babel-plugin-module-resolver не работает с react native и typescript

#typescript #react-native #babeljs #tsconfig

#typescript #react-native #babeljs #tsconfig

Вопрос:

Я пытался внедрить module-resolver в свое приложение react native, но vs code подчеркивает красным строки импорта

файл tsconfig.json

 {
  "compilerOptions": {
    "allowSyntheticDefaultImports": true,
    "jsx": "react-native",
    "lib": ["dom", "esnext"],
    "moduleResolution": "node",
    "noEmit": true,
    "skipLibCheck": true,
    "resolveJsonModule": true,
    "strict": true,
    "baseUrl": ".",
    "paths": {
      "@utils/*": ["./src/utils/*"],
      "@components/*": ["./src/components/*"],
      "@constants/*": ["./src/constants/*"],
      "@data/*": ["./src/data/*"],
      "@hooks/*": ["./src/hooks/*"],
      "@redux/*:": ["./src/redux/*"],
      "@screens/*": ["./src/screens/*"],
      "@services/*": ["./src/services/*"],
      "@types/*": ["./src/types/*"]
    }
  }
}
 

babel.config.js файл

  [
            "module-resolver",
            {
              root: ["."],
              extensions: [
                ".ios.ts",
                ".android.ts",
                ".ts",
                ".ios.tsx",
                ".android.tsx",
                ".tsx",
                ".jsx",
                ".js",
                ".json",
              ],
              alias: {
                "@assets": "./assets",
                "@components": "./src/components",
                "@constants": "./src/constants",
                "@data": "./src/data",
                "@hooks": "./src/hooks",
                "@redux": "./src/redux",
                "@screens": "./src/screens",
                "@services": "./src/services",
                "@types": "./src/types",
                "@utils": "./src/utils",
              },
            },
          ],
 

Моя структура папок выглядит следующим образом

введите описание изображения здесь

Ошибка такая

введите описание изображения здесь

Код работает, но как я могу исправить ошибку редактора?