如何使eslint解析jsconfig中映射的路径

在我的nextjs项目中，我已映射路径jsconfig.json以轻松进行绝对导入

{
  "compilerOptions": {
    "baseUrl": "./",
    "paths": {
      "@/*": ["./*"]
    },
    "target": "es6",
    "module": "commonjs",
    "experimentalDecorators": true
  }
}

我的导入路径如下所示 import { VIEW } from '@/src/shared/constants';

我的eslintrc.js设置指定为

module.exports = {
    ... ,
    settings: {
        "import/resolver": {
          alias: {
            extensions: [".js"],
            map: ["@", "."]
          }
        }
      }
}

我仍然收到错误消息说无法解决“ @ / what / ever / my / path / is”

我如何使eslint实现jsconfig路径

我在eslintrc中使用babel-eslint作为解析器。在搜索时，我意识到我需要添加babel-plugin-module-resolverbabelrc来解析模块。在此文件中，我们可以定义映射路径，这些路径位于jsconfig中。

因此，在babelrc文件中添加以下插件即可成功编译我的代码。

[
    "module-resolver",
    {
        "alias": {
          "@": "./"
        }
    }
]

根据eslint-import-resolver-alias的文档，该map属性应为数组数组，因此请尝试以下操作：

module.exports = {
    ... ,
    settings: {
        "import/resolver": {
          alias: {
            extensions: [".js"],
            map: [ ["@", "."] ]
          }
        }
      }
}

另外，请仔细检查您是否已实际eslint-import-resolver-alias安装-很容易忘记！