Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

React Native Typescript babel-plugin-module-resolver error: Cannot find module or its corresponding type declerations

$
0
0

I can use the module resolver with Javascript without any problem. Actually I can use it with Typescript without problem on runtime but on developing part I could not find the solution of Cannot find module or its corresponding type declerations problem.I'm looking for an answer which part am I doing it wrong?

Here are the files:

.babelrc

{"presets": ["module:metro-react-native-babel-preset"],"plugins": [    ["module-resolver",      {"root": ["./src"],"alias": [          { "@shared-components": "./shared/components" },          { "@shared-constants": "./shared/constants" },          { "@shared-theme": "./shared/theme" },          { "@font-size": "./shared/theme/font-size" },          { "@api": "./services/api/index" },          { "@fonts": "./shared/theme/fonts/index" },          { "@colors": "./shared/theme/colors" },          { "@theme": "./shared/theme/index" },          { "@services": "./services" },          { "@screens": "./screens" },          { "@utils": "./utils/" },          { "@assets": "./assets/" }        ],"extensions": [".js", ".jsx", ".ts", ".tsx"]      }    ]  ]}

tsconfig.json

{"compilerOptions": {"target": "esnext","module": "esnext","lib": ["esnext"],"allowJs": true,"jsx": "react-native","noEmit": true,"isolatedModules": true,"strict": true,"moduleResolution": "node","allowSyntheticDefaultImports": true,"esModuleInterop": true,    // ? Custom ones"skipLibCheck": true,"resolveJsonModule": true,"noImplicitAny": true,"strictNullChecks": true,"strictFunctionTypes": true,"strictPropertyInitialization": true,"noImplicitThis": true,"alwaysStrict": true,"noUnusedLocals": true,"noUnusedParameters": true,"noImplicitReturns": true,"noFallthroughCasesInSwitch": true,"forceConsistentCasingInFileNames": true,    // ? Babel Plugin Module Resolver"baseUrl": "./src","paths": {"@shared-components": ["./shared/components"],"@shared-constants": ["./shared/constants"],"@shared-theme": ["./shared/theme"],"@font-size": ["./shared/theme/font-size"],"@api": ["./services/api/index"],"@fonts": ["./shared/theme/fonts/index"],"@colors": ["./shared/theme/colors"],"@theme": ["./shared/theme/index"],"@services": ["./services"],"@screens": ["./screens"],"@utils": ["./utils/"],"@assets": ["./assets/"]    }  },"exclude": ["node_modules","babel.config.js","metro.config.js","jest.config.js"  ]}

Usage in .tsx file

import HomeScreen from "@screens/home/HomeScreen";import SearchScreen from "@screens/search/SearchScreen";import DetailScreen from "@screens/detail/DetailScreen";

The errorimage

Thank you for the helping :)


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>