Why .eslintrc may don't see aliases from .babelrc.js? - babeljs

Question

I have some aliases inside .babelrc.js
And .eslintrc with eslint-import-resolver-babel-module plugin to get aliases from babel config.
But eslint anyway can't resolve aliases.
.babelrc.js, .eslintrc, package.json in the gist: https://gist.github.com/SilentImp/4d005064063701faa04c29b02114d0df
.babelrc.js
const fs = require('fs');
const path = require('path');
const projectPath = path.resolve(__dirname, './');
const pathToSrc = path.resolve(projectPath, 'src');
const stats = fs.statSync(pathToSrc);
const env = process.env.NODE_ENV || 'dev';
const envAppConfigURL = path.resolve(__dirname, `../app/${env}.js`);
const devAppConfigURL = path.resolve(__dirname, 'dev.js');
const localAppConfigURL = path.resolve(__dirname, 'local.js');
const sampleAppConfigURL = path.resolve(__dirname, 'local.sample.js');
const isEnvConfig = fs.existsSync(envAppConfigURL);
const isDevConfig = fs.existsSync(devAppConfigURL);
const isLocalConfig = fs.existsSync(localAppConfigURL);
const isSampleConfig = fs.existsSync(sampleAppConfigURL);
let ConfigURL;
if (isEnvConfig) {
ConfigURL = envAppConfigURL;
} else if (isLocalConfig) {
ConfigURL = localAppConfigURL;
} else if (isSampleConfig) {
ConfigURL = sampleAppConfigURL;
} else {
ConfigURL = devAppConfigURL;
}
module.exports = {
"presets": [
["#babel/preset-env", {
"targets": {
"uglify": true,
"node": "current",
"browsers": ["> 3%", "ie 11"]
},
"debug": false,
}],
"#babel/preset-react",
["#babel/preset-stage-0", {
"decoratorsLegacy": true,
}]
],
"plugins": [
["module-resolver", {
"root": ["/"],
"alias": {
Config$: ConfigURL,
Utils: path.resolve(projectPath, 'src/shared/utils/'),
Components: path.resolve(projectPath, 'src/shared/components/'),
Reducers: path.resolve(projectPath, 'src/shared/reducers/'),
Images: path.resolve(projectPath, 'src/shared/assets/images/'),
Icons: path.resolve(projectPath, 'src/shared/assets/icons/'),
Styles: path.resolve(projectPath, 'src/shared/assets/styles/'),
Shared: path.resolve(projectPath, 'src/shared/'),
}
}],
"react-css-modules",
"#babel/plugin-proposal-export-default-from",
["#babel/plugin-proposal-decorators", {
"legacy": true
}],
["#babel/plugin-proposal-class-properties", {
"loose" : true
}]
],
};
.eslintrc
{
"env": {
"browser": true,
"node": true,
"jest": true,
"worker": true,
"serviceworker": true,
"es6": true
},
"extends": "airbnb",
"parser": "babel-eslint",
"globals": {
"FontFaceObserver": true,
"fontFaceSet": true,
},
"plugins": [
"react",
"jsx-a11y",
"import",
"jest"
],
"rules": {
"jsx-a11y/anchor-is-valid": [ "error", { "components": [ "Link" ], "specialLink": [ "to" ] } ],
"no-underscore-dangle": ["error", { "allow": ["_id", "_insertCss", "_getCss","__REDUX_STATE__", "_meta"] }],
"no-restricted-syntax": ["error", "WithStatement", "BinaryExpression[operator='in']"]
},
"settings": {
"import/resolver": {
"babel-module": {}
}
}
}

Answer 1

Well it seems that I need to duplicate all aliases in both configs.
I have rewrite .eslintrc as .eslintrc.js:
const fs = require('fs');
const path = require('path');
const projectPath = path.resolve(__dirname, './');
const pathToSrc = path.resolve(projectPath, 'src');
const configPath = path.resolve(projectPath, 'config/app');
const stats = fs.statSync(pathToSrc);
const env = process.env.NODE_ENV || 'dev';
const envAppConfigURL = path.resolve(configPath, `${env}.js`);
const devAppConfigURL = path.resolve(configPath, 'dev.js');
const localAppConfigURL = path.resolve(configPath, 'local.js');
const sampleAppConfigURL = path.resolve(configPath, 'local.sample.js');
const isEnvConfig = fs.existsSync(envAppConfigURL);
const isDevConfig = fs.existsSync(devAppConfigURL);
const isLocalConfig = fs.existsSync(localAppConfigURL);
const isSampleConfig = fs.existsSync(sampleAppConfigURL);
let ConfigURL;
if (isEnvConfig) {
ConfigURL = envAppConfigURL;
} else if (isLocalConfig) {
ConfigURL = localAppConfigURL;
} else if (isSampleConfig) {
ConfigURL = sampleAppConfigURL;
} else {
ConfigURL = devAppConfigURL;
}
module.exports = {
"env": {
"browser": true,
"node": true,
"jest": true,
"worker": true,
"serviceworker": true,
"es6": true
},
"extends": "airbnb",
"parser": "babel-eslint",
"globals": {
"FontFaceObserver": true,
"fontFaceSet": true,
},
"plugins": [
"react",
"jsx-a11y",
"import",
"jest"
],
"rules": {
"jsx-a11y/anchor-is-valid": [ "error", { "components": [ "Link" ], "specialLink": [ "to" ] } ],
"no-underscore-dangle": ["error", { "allow": ["_id", "_insertCss", "_getCss","__REDUX_STATE__", "_meta"] }],
"no-restricted-syntax": ["error", "WithStatement", "BinaryExpression[operator='in']"]
},
"settings": {
"import/resolver": {
"babel-module": {
"alias": {
Config$: ConfigURL,
Utils: path.resolve(projectPath, 'src/shared/utils/'),
Components: path.resolve(projectPath, 'src/shared/components/'),
Reducers: path.resolve(projectPath, 'src/shared/reducers/'),
Images: path.resolve(projectPath, 'src/shared/assets/images/'),
Icons: path.resolve(projectPath, 'src/shared/assets/icons/'),
Styles: path.resolve(projectPath, 'src/shared/assets/styles/'),
Shared: path.resolve(projectPath, 'src/shared/'),
}
}
}
}
};