IntelliJ / Webstorm無法找到導入參考

Question

我有以下項目結構：

• 根
  • SRC
    • 腳本
      • main.js
      • foo.js

在我的main.js文件中，我正在導入foo.js如下所示：

import 'src/scripts/foo.js'

當我點擊上面的import語句並轉到Navigate -> Declaration我收到一條超級有用的消息，上面寫着Cannot find declaration to go 。

這使得使用起來非常令人沮喪，因為編輯器基本上不知道哪些文件導入其他文件。 這意味着我無法使用IDE的有用功能，例如在移動文件，查找用法等時搜索引用

如果我將import語句更改為相對語句，則它完全起作用：

import './foo.js'

但是，我們正在努力實現絕對進口，這是我們從編寫python應用程序中汲取的習慣 。

我遇到了Webstorm：“無法解析目錄” ，這讓我想到將我的src目錄mark為Sources Root 。 這樣做之后，我可以將main.js中的import語句main.js為

import '/scripts/foo.js' //notice the leading forward slash

嗯，這有點好，因為現在我至少可以Navigate -> Declaration但它並不理想，因為現在我無法將src下面的任何目錄標記為測試，資源等。

那么為什么IntelliJ / webstorm讓這么難做呢？

Answer 1

因為現在我無法將src下面的任何目錄標記為測試，資源等。

是的你可以。 無法在“項目視圖”中標記已標記文件夾的子文件夾。 但您可以在項目結構中執行此操作（ Ctrl + Shift + Alt + S ）。 轉到Modules ，選擇模塊並切換到“ Sources選項卡。 現在你可以將你的src文件夾標記為Sources （你已經做過）並將src/test標記為Tests等。

根據Web幫助 ，在WebStorm中，此設置隱藏在Settings > Directories而不是“項目結構”中。

這是另一個僅使用項目視圖的解決方案：取消標記源文件夾，標記測試/資源子文件夾，然后再次標記（父）源文件夾。 我不確定，為什么它不起作用。

Answer 2

我非常建議不要在JavaScript代碼中使用這種導入方式。 雖然可能可行，但相對路徑是所有NodeJS代碼中的事實標准，並且已經擴展到使用模塊系統的所有JS代碼。

在當前系統中，任何路徑都以. 是相對的，任何以/開頭的路徑都是絕對路徑，任何其他路徑都解析為模塊。 根據該邏輯，相對於名為src的依賴模塊， import 'src/scripts/foo.js'將被解析為./scripts/foo.js 。

另請注意，文件擴展名是可選的，通常不用處理。

如果你想使用這種風格並且你的模塊加載器支持它，你當然可以自由地這樣做，但我想強調你可能會通過使用非標准方法給自己帶來痛苦。