Babel module resolver doesn't work as expected

Question

I configured babel-plugin-module-resolver with eslint in my node project. This is my eslintrc.

{
  "env": {
    "es6": true,
    "node": true
  },
  "extends": [
    "airbnb-base"
  ],
  "globals": {
    "Atomics": "readonly",
    "SharedArrayBuffer": "readonly"
  },
  "parserOptions": {
    "ecmaVersion": 2018,
    "sourceType": "module"
  },
  "settings": {
    "import/resolver": {
      "babel-module": {}
    }
  },
  "rules": {
    "class-methods-use-this": "off",
    "newline-per-chained-call": "off",
    "indent": ["warn", 2],
    "quotes": ["warn", "single"],
    "no-unused-vars": ["error", {"warn": "none"}],
    "max-len": ["warn", 150],
    "no-console": 1,
    "object-curly-newline": ["warn", {
      "ObjectPattern": { "multiline": true },
      "ExportDeclaration": { "multiline": true, "minProperties": 4 }
    }]
  }
}

This is my babelrc file.

{   
  "presets": ["@babel/preset-env"],
  "plugins": [
    [
      "module-resolver",
      {
        "alias": {
          "constants": "./constants",
          "database": "./database",
          "library": "./library",
          "mappers": "./mappers",
          "middleware": "./middleware",
          "models": "./models",
          "repositories": "./repositories",
          "routes": "./routes",
          "services": "./services",
          "utils": "./utils"
        }
      }
    ]
  ] 
} 

Now in my project the paths are working properly like this.

import User from 'models/user.model';
import UserRepository from 'repositories/user.repository';

But I have the following issues. When I click on an import, it doesn't go to the definition. IntelliSense are not working.

What am I doing here with these plugins? I want ot have intellisense and go to definition(navigating) feature.

Answer 1

@shashika, you have to set up the jsconfig.json for the javascript project, tsconfig.json for the typescript project to make your custom-defined path go to the respective files definition,

Example:

    {
     "compilerOptions": {
       "baseUrl": ".",
       "paths": {
         "@/*": ["./src/*"],
         "@util/*": ["./util/*"],
       },
    }