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

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 作为我的解析器。在搜索时，我意识到我需要添加 babel-plugin-module-resolver在 babelrc 中解析模块。在这个文件中，我们可以定义我们的 jsconfig 中的映射路径。

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

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