Eslint 不尊重 jsconfig 路径

Question

我在 monorepo 中有我的 express.js 项目。我想为其添加自定义路径别名。目录结构为：

./
server/
----> jsconfig.json
----> .eslintrc.js
----> src/
--------> index.js
--------> modules/auth
-------------> auth.controller.js

jsconfig.json

{
  "compilerOptions": {
    "module": "ES6",
    "baseUrl": "./",
    "paths": {
      "@modules/*": [
        "src/modules/*"
      ]
    }
  },
  "exclude": ["node_modules"]
}

.eslintrc.js

module.exports = {
  env: {
    es2021: true,
    node: true,
  },
  extends: [
    'airbnb-base',
  ],
  parserOptions: {
    ecmaVersion: 12,
    sourceType: 'module',
  },
  rules: {
    'no-console': 'error',
    'no-debugger': 'error',
  },
  settings: {
    'import/resolver': {
      alias: {
        map: [
          ['@modules/*', 'src/modules/*'],
        ],
        extensions: ['.js', '.json'],
      },
    },
  },
};

简单地说，我只是尝试在我的 index.js 文件中导入 auth 控制器。

import authRoutes from '@modules/auth/auth.routes';

但我收到以下错误：Unable to resolve path to module '@modules/auth/auth.controller' .eslint import/no-unresolved

请不要建议关闭规则。我已经尝试了 eslint-import-resolver-jsconfig，但我得到了 Cannot resolve jsConfig, SyntaxError } on 150。

Answer 1

为了实现上述目标，我使用了 module-alias 包。

将其作为普通依赖项安装后，npm i --save module-alias，将以下内容添加到您的 package.json:

"_moduleAliases": {
  "@modules": "./src/modules"
}

这基本上会为您要定义的所有别名定义映射。

要使其正常工作，您现在需要在 index.js 下的应用程序顶部导入以下内容：

require("module-alias/register"); // If using commonJS
// or
import "module-alias/register"; // If transpiling es6

您现在已经准备就绪，应该可以导入您的文件，其绝对路径如下所示：

const authRoutes = require("@modules/auth/auth.routes")
// or
import authRoutes from "@modules/auth/auth.routes";

如果 eslint 仍然标记未解析的路径，您可能需要更新 jsconfig.json 或 tsconfig.json 以包含以下内容：

"paths": {
   "@modules/*": ["src/modules/*"]
}

您可以找到包文档并阅读有关其用法的更多信息here。

Answer 2

因为我用的是monorepo，ESLint甚至lint-staged都有问题。所以现在我每个存储库只有一个项目并且：

在 jsconfig.json 中添加了自定义路径：

"paths": {
      "@modules/*": [
        "./src/modules/*"
      ]
    }

已安装 eslint-import-resolver-jsconfig 并将以下配置添加到 eslint.json：

"extends": [
    "airbnb-base",
    "eslint:recommended"
  ],
 "plugins": ["import"],
 "settings": {
    "import/resolver": {
      "jsconfig": {
        "config": "jsconfig.json"
      }
    }
  }

安装了 Babel 插件 babel-plugin-module-resolver 并将以下设置添加到 .babelrc:

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

但是，再说一次：这仅适用于每个存储库一个项目并且所有配置文件（.*rc、package.json 等）都在根级别的情况。

Eslint 不尊重 jsconfig 路径

Eslint doesn't respect jsconfig paths

javascript

express

eslint

vscode-jsconfig