如何在 WebStorm（和 PhpStorm 等）中启用对 SvelteKit 的 $lib 别名的支持？

Question

是否可以定义一个特殊的映射，使 PhpStorm（或其他基于 WebStorm 的 IDE）能够查找位于 SvelteKit 的特殊$lib目录别名中的文件？

例如，在 PhpStorm 中，我导入全局样式，如下所示：

<script context="module">
    import '$lib/global-styles.scss';
</script>

然而，不幸的是，当尝试导航到该特定文件时，IDE 会显示“无法找到要转到的声明”：

Answer 1

似乎修复相当简单（受到这个答案的启发）。只需向项目根目录中的任何 JS 文件添加一个路径别名.webstorm.js（文件名并不重要）：

\n

// eslint-disable\nSystem.config({\n    "paths": {\n        "$lib/*": "./src/lib/*",\n    }\n});\n

\n

现在导航到$lib/*\xe2\x9c\xa8 下的路径应该自动“正常工作”。不幸的是，我找不到这个特殊的 WebStorm 特定System.config()解决方法的文档，我能找到的最好的就是这个评论。

\n\n

编辑（2023 年 5 月 2 日）：此外，对于 TypeScript 支持，请使用 Tyrone 的此答案中建议的方法，该方法可能有更广泛的支持，该方法可能在 Jetbrains IDE 之外

\n

Answer 2

./tsconfig.json我遇到了这个问题，但通过在项目根目录下添加路径条目解决了它（因为我使用的是 Typescript） 。

{
  // ...
  "compilerOptions": {
      "paths": {
          "$lib/*": ["src/lib/*"],
      }
   }
}