Eslint + typescript paths aliasing with craco Unable to resolve path to module '#SomeFolder/SomeComponent' - import

Question

can someone pls explain to me why I am still getting the error when I'm using
import SomeComponent from '#someFolder/SomeComponent';
this is my error
Unable to resolve the path to module '#SomeFolder/SomeComponent'
this is part of my esLint
"settings": {
"import/resolver": {
"alias": {
"map": [["#", "./src"], ["#someFolder", "./src/components/SomeFolder/*"]],
"extensions": [".ts", ".tsx", ".js", ".jsx", ".json"]
},
}
}
and this is part of my craco.config
webpack: {
alias: {
'#convertor': path.resolve(__dirname, `src/convertors`),
'#someFolder': path.resolve(__dirname, `src/components/SomeFolder`),
},
},
jest: {
configure: {
moduleNameMapper: {
'^#someFolder(.*)$': '<rootDir>/src/components/SomeFolder',
},
},
}, webpack: {
alias: {
'#convertor': path.resolve(__dirname, `src/convertors`),
'#someFolder': path.resolve(__dirname, `src/components/SomeFolder`),
},
},
jest: {
configure: {
moduleNameMapper: {
'^#someFolder(.*)$': '<rootDir>/src/components/SomeFolder',
},
},
},
this is tsconfig.paths.json
{
"compilerOptions": {
"baseUrl": "src",
"paths": {
"#someFolder/*": [ "src/components/SomeFolder/*" ],
"#convertor/*": [ "src/convertors/*" ],
}
}
}
this is full eslingrc
{
"plugins": ["import"],
"extends": [
"airbnb-typescript-prettier",
"plugin:react/recommended",
"plugin:import/recommended",
"plugin:import/typescript"
],
"rules": {
"no-param-reassign": ["error", {
"props": true,
"ignorePropertyModificationsFor": [
"state"
]
}],
"#typescript-eslint/no-explicit-any": 0,
"#typescript-eslint/no-empty-function": 0,
"#typescript-eslint/camelcase": 0,
"#typescript-eslint/no-unused-vars": "warn",
"#typescript-eslint/ban-ts-comment": "warn",
"#typescript-eslint/no-shadow": "warn",
"#typescript-eslint/ban-types": 0,
"react/jsx-props-no-spreading": 0,
"#typescript-eslint/no-use-before-define": 0,
"jsx-a11y/alt-text": 0,
"max-classes-per-file": ["error", 10],
"prettier/prettier": [
"warn",
{
"endOfLine": "auto"
}
],
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx", ".ts", ".tsx"] }],
"react/prop-types": 0,
"react/jsx-no-bind": 0,
"react/destructuring-assignment": "warn",
"react/require-default-props": "warn",
"react/react-in-jsx-scope": 0,
"react/button-has-type": 0,
"react/no-array-index-key": "warn",
"react/display-name": 0,
"jsx-a11y/click-events-have-key-events": 0,
"jsx-a11y/no-noninteractive-element-interactions": 0,
"jsx-a11y/no-static-element-interactions": 0,
"jsx-a11y/anchor-is-valid": 0,
"react-hooks/exhaustive-deps": "warn",
"radix": ["error", "as-needed"],
"no-nested-ternary": "warn",
"no-plusplus": 0,
"import/prefer-default-export": 0,
"import/order": "warn",
"import/extensions": "warn",
"import/no-cycle": 0,
"consistent-return": 0,
"camelcase": "warn",
"guard-for-in": 0,
"no-restricted-syntax": 0,
"no-debugger": 1
},
"overrides": [
{
"files": ["**/*.test.js", "**/*.test.jsx", "**/*.test.ts", "**/*.test.tsx"],
"env": {
"jest": true
}
}
],
"settings": {
"import/resolver": {
"alias": {
"map": [["#", "./src"], ["#someFolder", "./src/components/SomeFolder/*"]],
"extensions": [".ts", ".tsx", ".js", ".jsx", ".json"]
},
"node": {
"paths": ["src"],
"extensions": [".js", ".jsx", ".ts", ".tsx"]
}
}
}
}
PS pls don't suggest disabling import/no-unresolved. this isn't fixing problem it's just ignoring it