Not able to absolute import in React Native project using babel-plugin-module-resolver

132 views Asked by At

The file structure of my project is:

|--node_modules
|--src
|--App.js
|--Splash.js

I want to import Splash.js in App.js using absolute import. So, I added babel-plugin-module-resolver and set up a babel.config.js with the following contents (followed How to enable jsconfig.json in react-native project):

module.exports = {
  presets: ['module:metro-react-native-babel-preset'],
  plugins: [
    ["module-resolver", {
      "root": ["./"]
    }]
  ]
};

and App.js

import Splash from 'Splash.js';

Error in my console:

error: Error: Unable to resolve module Splash.js from C:\Users\<userName>\Desktop\<AppName>\App.js: Splash.js could not be found within the project or in these directories:
  node_modules

Can anyone explain what is actually happening? How does baseUrl actually work? I am using it in a wrong way?

0

There are 0 answers