如何在eslintrc中手动添加要解析的路径

Question

我的项目中有一个文件夹

main

，我像模块一样解析它。例如

import x from 'main/src'

导入

main/src/index.js

。这是通过 webpack 的解析别名配置完成的。

我遇到的一个问题是通过 eslint 消除错误。我知道 eslint 提供了一个 webpack 解析插件，但是，我一直无法让它工作。我怀疑这是因为我使用的是 webpack 2 并在 webpack 配置文件中使用 es6。

是否有手动方法来编写解决设置来解决我的 eslint 的此问题？

我见过的唯一其他黑客工作是使用

import/core-modules

，但随后我必须列出子目录树中的每个文件夹

main/src/bar

，

main/src/foo

。这并不理想。

Answer 1

我认为下面的链接对您有帮助。您可以使用配置添加解析目录。

例如，如果你想解决

src/

，你可以在

.eslintrc

上像下面这样写。

{
  "settings": {
    "import/resolver": {
      "node": {
        "paths": ["src"]
      }
    }
  }
}

然后 ESLint 从 src 目录解析。您可以通过编写

src/hoge/moge.js

来要求

const moge = require('hoge/moge');

，并且 ESLint 知道这一点。

Answer 2

太晚看到这个问题了。实际上，已经有一个名为 eslint-import-resolver-alias 的解析器通过以下设置实现了此功能。

{
  settings: {
    'import/resolver': {
      'alias': [
        ['main/src', './main/src']
       ]
     }
  }
}

Answer 3

我面临着类似的问题：

ESLint

无法解析相对于我的

"baseUrl": "src"

中的指令

tsconfig.json

导入的模块。

设法以类似于标记为解决方案答案的方式解决问题，只是我必须添加扩展数组。所以我将以下内容添加到我的

.eslintrc.js

：

  settings: {
    'import/resolver': {
      node: {
        extensions: ['.js', '.jsx', '.ts', '.tsx'],
        paths: ['./src']
      }
    }
  },

希望这对某人有帮助。我的解决方案的来源实际上是 package 的 npm 页面。

Answer 4

我对 webpack 也有同样的问题。我安装了 eslint-import-resolver-webpack 并更新了 .eslintrc

{
    "settings": {
        "import/resolver": "webpack"
    }
}

Answer 5

我的工作设置

.eslintrc.js

  settings: {
    'import/resolver': {
      node: {
        paths: ['.'],
      },
    },
  },

和

tsconfig.json

{
  "compilerOptions": {
    ...
    "baseUrl": "./",
    ...
  },
}

Answer 6

对于我的情况，当我尝试在那里导入

react-native-svg

包时，我在 React 中遇到了 eslint 这样的错误。我这样做是因为我对 React 和 React-Native 使用同一个代码库。所以对我来说，以下代码适用于

.eslintrc

：

"import/no-unresolved": [
  2,
  {
    ignore: [
      'react-native-svg'
    ]
  }],

希望这对其他人有帮助

Answer 7

正如 Zip184 在上面的评论中所说如果你有多个webpack配置，你必须指定配置的路径

"settings": {
  "import/resolver": {
    "webpack": {
      "config": "webpack.common.js"
    }
  }
}