javascript - WebStorm 中导入的路径别名

Question

我使用 webpack 路径别名来加载 ES6 模块。

例如 如果我为 utils 定义一个别名而不是像
从 "../../../utils/foo"导入 Foo，我可以做到
从“utils/foo”导入 Foo

问题是，一旦我开始使用别名，WebStorm 就会失去对导入的跟踪，我会收到警告并且没有自动完成。

有没有办法指示 WebStorm 使用此类别名？

Answer 1

是的，有。

事实上，Webstorm并不能自动解析和应用Webpack config，但是你可以用同样的方式设置别名。

您只需将“utils”(在您的示例中)的parent 文件夹标记为resource root(右键单击，将目录标记为/resource root) .

我们刚刚设法处理了以下结构:

/src
    /A
    /B
    /C

我们在 Webpack 中将 A B 和 C 文件夹声明为别名。 在 Webstorm 中，我们将“src”标记为“Resource Root”。

现在我们可以简单地导入:

import A/path/to/any/file.js

代替

import ../../../../../A/path/to/any/file.js

同时仍然让 Webstorm 正确解析和索引所有代码、链接到文件、自动完成等等......