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

Question

是否可以定义一个特殊的映射，使 PhpStorm（或其他基于 WebStorm 的 IDE）能够找到位于 SvelteKit 的特殊

$lib

目录别名中的文件？

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

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

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

Answer 1

似乎修复相当简单（受this answer启发）。只需将路径别名添加到项目根目录中的任何 JS 文件，称为

.webstorm.js

（文件名不重要）：

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

现在导航到

$lib/*

下的路径应该自动“正常工作”✨。不幸的是，我找不到这个特殊的 WebStorm 特定

System.config()

解决方法的文档，我能找到的最好的是this comment Jetbrains' issue tracker.

Answer 2

尝试在项目的 tsconfig.json 中添加

baseUrl

：

{
"extends": "./.svelte-kit/tsconfig.json",
"compilerOptions": {
    ...
    "baseUrl": "./src"
}