Question

在我的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路径

Answer 1

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

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

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

Answer 2

根据the docs for eslint-import-resolver-alias，map属性应该是一个数组数组，因此请尝试以下操作：

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

此外，再次检查您是否确实安装了eslint-import-resolver-alias-很容易忘记！

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

2 个答案: