WebStorm无法识别tsconfig路径。

Question

我们有一个问题，WebStorm会抱怨一些命名路径。然而，使用webpack构建一切都很好。

这是我们的文件结构:

apps
  app1
    tsconfig.e2e.json
    src
      tests
        testsuite1
          file.po.ts
libs
  lib1
    src
      index.ts
      libs

我们的lib的index.ts:

export * from './lib';

我们的tsconfig.e2e.json中的路径:

{
  "compilerOptions": {
    ...
    "paths": {
      "@a/lib1": ["../../libs/lib1/src"],
    }
  }
}

我们在 file.po.ts 文件中导入的内容在 WebStorm 中被标记为未找到。

import { Mo } from '@a/lib1';

我们已在WebStorm中启用了TypeScript语言服务，并且一些类似的导入正在工作。我们对TypeScript和WebStorm都很陌生，可能有些地方还需要改进。

- Pablo Jomer

---

对我来说，使用类似的设置可以正常工作。请分享一个示例项目，以便重新创建此问题（它可以是具有相似文件夹结构和相同 tsconfig.*.json 文件以及几个仅包含导入/导出和虚拟声明的虚拟 ts 文件的项目 - 我不需要您的专有代码）。 - lena

你使用的是哪个版本的WebStorm和什么操作系统？ - Pablo Jomer

WebStorm 2018.3.4（最新版本），Windows。操作系统在这里并不重要。 - lena

Answer 1

添加新路径后需要重新启动

我遇到了同样的问题；在 tsconfig.json 文件中添加了新的路径后，我需要重新启动我的Intellij IDEA才能让它在导入语句中识别这个路径。

"paths": {
  "@alias/*": ["folder/*"],
},

重启后，它不再用红色下划线标记路径：

import { SomeFeatureModule } from '@alias/some-feature/some-feature.module';

检查路径是否相对于baseUrl

如果这不解决问题，请控制点击实际别名以查看是否被识别；点击应该会带您到声明路径别名的 tsconfig.json 文件。还要检查实际路径是否正确地考虑了 compilerOptions 配置的 baseUrl 属性。路径应该相对于这个基础url。

所以例如：

"baseUrl": "src",

这意味着上面的例子中，现有文件夹实际上应该是：

src/folder/*

- Wilt

---

我在设置了@alias后重新启动，但并没有什么变化；然后我又添加了 baseUrl，接着又得重新启动。这是在 PhpStorm 2021.1.2 上（据我所知，它基于 WebStorm）。 - halfer

在我的情况下，我忘记在文件夹后面加上*（星号）：folder/*。 - Neeryck

baseUrl 对我来说很关键，谢谢！ - Richard Coates

请问为什么需要使用tsconfig路径才能使自动完成功能正常工作？如果我在项目中使用原始的JS而不是Typescript，自动完成功能将如何工作？ - Marian Klühspies