在使用ES2015模組匯入功能的時候你有什麼覺得不爽的地方嗎？反正我有！下面就來說說。

1.命名匯入和自動完成

假設你編寫了一個簡單的JavaScript模組：

// stringUtils.js
export function equalsIgnoreCase(string1, string2) {
  return string1.toLowerCase() === string2.toLowerCase();
}

這是一個stringUtils模組。該模組具有一個名為equalsIgnoreCase的匯出，該函式比較兩個忽略大小寫的字串。

到目前為止，一切看起來都不錯。

現在，讓我們嘗試從stringUtils模組中匯入equalsIgnoreCase函式到另一個JavaScript模組app中：

// app.js
import { equalsIgnoreCase } from './stringUtils';

equalsIgnoreCase('Hello', 'hello'); // => true

首先，你必須編寫匯入語句import {}，在此步驟中，IDE無法提供有關要匯入的可用名稱的任何建議。

然後你繼續寫from './stringUtils'，然後回到花括號，展開自動完成（autocomplete）以選擇要匯入的名稱。

儘管ES2015模組有很多優點，但是 import 模組語法很難使用自動完成。

東莞vi設計https://www.houdianzi.com/dgvi/ 豌豆資源網站大全

2. Python 中的模組

現在，讓我們嘗試在Python中匯入命名元件。是否有同樣的問題？

這是用Python實現的相同模組stringUtils和equalsIgnoreCase函式：

# stringUtils.py
def equalsIgnoreCase(string1, string2):
  return string1.lower() == string2.lower()

在Python中，你無需明確指出要匯出的函式。

現在，在另一個Python模組應用程式內部，讓我們嘗試從stringUtils匯入equalsIgnoreCase函式：

# app.py
from stringUtils import equalsIgnoreCase

equalsIgnoreCase('Hello', 'hello') # => true
 

在Python中，指出您要從中匯入的模組：from stringUtils，然後寫匯入什麼…

如果你想知道可以匯入的函式，編輯器已經知道了模組名並給出了必要的建議。方法更好!

3.解決方案

我能找到的在JavaScript中對命名匯入啟用自動完成的唯一解決方案是call ide以獲得幫助。

例如，在Visual Studio Code中，你可以安裝JavaScript（ES6）程式碼片段外掛。

啟用外掛後，通過使用imd程式碼段並按tab鍵，游標首先跳到編寫模組路徑的位置。然後，在按下tab鍵後，游標會跳轉回花括號內的匯入位置。

啟用外掛後，通過使用imd程式碼段並按tab鍵，游標首先跳到編寫模組路徑的位置。然後，在按下tab鍵後，游標會跳轉回花括號內的匯入位置。它是這樣工作的：

總結

在JavaScript中，匯入語法強制您首先指定要匯入的項(函式、類、變數)，然後指定模組的路徑。這種方法對自動完成是不友好的。

在Python中則相反，首先指定模組名稱，然後指定要匯入的元件，從stringUtils匯入equalsIgnoreCase，使用此語法可以輕鬆自動完成匯入的專案。

使用ES6程式碼片段外掛，您可以減輕在JavaScript中命名匯入自動完成的問題。總比沒有好。

您是否發現在ES模組中使用自動完成有困難？如果是，你知道什麼解決方案？