指向文件而不是目录时，Eslint 无法解析模块的路径

Question

我有一个带有 Typescript 的 React JS 项目，我使用 Eslint 进行 linting。 我已将路径别名添加到tsconfig.json和webpack.config.json看起来像这样

// webpack.config.json
components: path.resolve(__dirname, './../src/components/')
...

和

// tsconfig.json
"components/*": ["components/*"],
...

所以，如果我有一个像src/components/Button/index.tsx导入为components/Button的文件，Eslint 是安静的。

当我将像src/components/Loader.tsx这样的文件导入为components/Loader时，问题就来了。 在这里，linter 抱怨Unable to resolve path to module 'components/Loader'

请注意：

• 项目编译成功。
• 我不想在我的eslintrc.json上使用"import/no-unresolved": 0来抑制此警告

我该如何解决这个问题？

Answer 1

使用 components/Loader 与 components/Loader/index.tsx 相同，但在您的情况下，没有包含 index.tsx 文件的此类 Loader 文件夹要删除警告，请使用 loader 和 index.tsx 文件创建文件夹结构或明确定义您正在通过 components/Loader.tsx 访问文件