在 WebStorm 中导入别名时使用 Webpack 别名导致 ESLint 错误

Question

我通过以下代码设置别名 Webpack 配置：

module: {
...
resolve: {
  alias: {
    utils: path.resolve(__dirname, 'src/utils/'),
    '@SharedBlocks': path.resolve(__dirname, 'src/application/shared-blocks'),
  },
  extensions: ['.js', '.json', '.jsx', '.scss'],
},
...

然后我ESLint在 WebStorm 中发现错误，如下所示：

当然，ESLint 无法解析，'@SharedBlocks/explorer'所以我添加了一个import/resolverto.eslint.js文件来配置它：

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

现在一切正常像所有编辑器VSCode等，但只是在WebStorm我见下图：

这太奇怪了，因为即使运行eslint .命令也不会返回 ESLint 规则错误，但只是在 WebStorm 中，我看到红色下划线 forimport也可以正常工作，但显示红色下划线 for import. 很奇怪，VSCode 没有任何问题并且运行良好

我该如何解决？

Answer 1

no-extraneous-dependenciesESLint 规则不考虑 EsLint 解析器，请参阅https://github.com/benmosher/eslint-plugin-import/issues/496。我不确定为什么该错误只能在 WebStorm 中看到。我建议联系支持人员解决此问题