eslint-plugin-import
eslint-plugin-import copied to clipboard
Issue with local modules not being recognised unless ESLint parserOptions.sourceType is set to "script".
Packages used: - babel-plugin-module-resolver v4.0.0 eslint-import-resolver-babel-module v5.1.2 eslint-plugin-import v2.22.0
I am unable to get ESLint to recognise the module import (Unable to resolve path to module '_components/TheThing'.eslint(import/no-unresolved)) unless I change parserOptions.sourceType to "script", which then messes up import statements in ES6 modules. All the local modules I am trying to import from are ES6 using export syntax.
What is the problem here? Why does parserOptions.sourceType being set to "module" cause this issue? Thanks.
.babelrc: -
{
"plugins": [
["module-resolver", {
"alias": {
"_components": "./components"
}
}]
]
}
.eslintrc.js: -
module.exports = {
parser: "@typescript-eslint/parser",
parserOptions: {
project: './tsconfig.json',
"ecmaFeatures": {
"jsx": true,
"generators": false,
"objectLiteralDuplicateProperties": false
},
"ecmaVersion": 6,
"sourceType": "module"
},
env: {
"browser": true,
"es6": true,
"node": true
},
"globals": {},
extends: [
"plugin:prettier/recommended",
"plugin:import/errors",
"plugin:import/warnings"
],
settings: {
react: {
"version": "detect",
},
"import/resolver": {
node: {
extensions: ['.js', '.jsx', '.ts', '.tsx'],
paths: ["./components"]
},
"babel-module": {}
},
},
plugins: [
"@typescript-eslint",
"import",
"jsx-a11y",
"prettier",
"react",
"react-hooks"
],
}
tsconfig.json: -
{
"compilerOptions": {
"baseUrl": ".",
"paths": {
"_components/*": ["./components/*"],
}
}
}