IntelliJ IDEA：配置JavaScript庫

配置JavaScript庫

在IntelliJ IDEA中，庫是一個(gè)文件或一組文件，除IntelliJ IDEA從您編輯的項(xiàng)目代碼中檢索的函數(shù)和方法外，其功能和方法也添加到IntelliJ IDEA的內(nèi)部知識(shí)中。在項(xiàng)目范圍內(nèi)，默認(rèn)情況下其庫是寫保護(hù)的。

IntelliJ IDEA僅使用庫來增強(qiáng)編碼幫助（即代碼完成，語法突出顯示，導(dǎo)航和文檔查找）。請(qǐng)注意，庫不是管理項(xiàng)目依賴項(xiàng)的方法。

使用TypeScript社區(qū)存根（TypeScript定義文件）

在IntelliJ IDEA中，可以配置DefinitelyTyped存根并將其用作庫，這在以下情況下特別有用：

提示：TypeScript社區(qū)存根也稱為TypeScript定義文件，TypeScript聲明文件或DefinitelyTyped存根，或僅稱為d.ts文件。

• 要改進(jìn)代碼完成，請(qǐng)解析對(duì)于IntelliJ IDEA靜態(tài)分析而言過于復(fù)雜的庫或框架的符號(hào)，并為這些符號(hào)添加類型信息。
• 從測(cè)試框架中解析全局定義的符號(hào)。

下面的示例顯示了Node Express應(yīng)用程序中的一段代碼，其中未解析該post()函數(shù)：

安裝了建議的TypeScript定義文件后，IntelliJ IDEA成功解析post()：

IntelliJ IDEA允許您直接從編輯器下載TypeScript定義文件，使用意圖操作，或者您可以在JavaScript. Libraries頁面上執(zhí)行此操作。

使用意圖操作下載TypeScript定義

• 將光標(biāo)放在具有此庫或框架的require語句處，按Alt+Enter，然后選擇安裝TypeScript定義以獲取更好的類型信息：
  
  
  IntelliJ IDEA下載庫的類型定義，并將它們添加到JavaScript. Libraries頁面上的庫列表中：
  
  

在“設(shè)置/首選項(xiàng)”對(duì)話框中下載TypeScript定義

1. 在“設(shè)置/首選項(xiàng)”對(duì)話框（Ctrl+Alt+S）中，單擊“語言和框架”下的“JavaScript” ，然后單擊“庫”。在JavaScript的。將打開“庫”頁面。
2. 單擊“下載”，在打開的“下載庫”對(duì)話框中，選擇所需的庫，然后單擊“下載并安裝”。
   
   
   IntelliJ IDEA下載所選庫的類型定義，并在“項(xiàng)目”視圖的“外部庫”節(jié)點(diǎn)中顯示它們。

配置Node.js核心庫

要獲得編譯為Node.js二進(jìn)制文件的fs， path， http和其他核心模塊的代碼完成和參考解析，您需要將Node.js核心模塊源配置為JavaScript庫。

配置Node.js Core

1. 在“設(shè)置/首選項(xiàng)”對(duì)話框（Ctrl+Alt+S）中，單擊“語言和框架”下的“Node.js和NPM” 。將打開該“Node.js和NPM”頁面。
2. 選中Node.js的編碼輔助復(fù)選框。

   請(qǐng)注意，Node.js核心庫是特定于版本的。因此，如果您在“Node.js和NPM”頁面上更改Node.js的版本，則需要再次選中該復(fù)選框。之后，IntelliJ IDEA為這個(gè)新版本創(chuàng)建了一個(gè)新庫。

配置node_modules庫

為了提供項(xiàng)目依賴項(xiàng)的代碼完成，IntelliJ IDEA會(huì)自動(dòng)創(chuàng)建一個(gè)node_modules庫，因此Node.js模塊保存在項(xiàng)目中，但不會(huì)對(duì)它們進(jìn)行檢查，從而提高了性能。

在“項(xiàng)目”工具窗口中，node_modules也標(biāo)記為庫：

但是，該node_modules庫僅包含項(xiàng)目package.json文件的dependencies對(duì)象中列出的模塊。IntelliJ IDEA不包含依賴項(xiàng)對(duì)node_modules庫的依賴性，但實(shí)際上將它們從項(xiàng)目中排除。

配置庫的范圍

有時(shí)您可能會(huì)注意到IntelliJ IDEA建議不相關(guān)的完成，例如，客戶端代碼中的Node.js API。發(fā)生這種情況是因?yàn)槟J(rèn)情況下IntelliJ IDEA在整個(gè)項(xiàng)目文件夾中使用庫來完成。IntelliJ IDEA允許您通過配置庫的范圍來調(diào)整代碼完成。

配置庫的范圍

1. 在“設(shè)置/首選項(xiàng)”對(duì)話框（Ctrl+Alt+S）中，單擊“語言和框架”下的“JavaScript” ，然后單擊“庫”。將打開“JavaScript. Libraries”頁面，其中顯示了所有已有庫的列表。
2. 選擇所需的庫，清除其旁邊的“已啟用”復(fù)選框，然后單擊“管理范圍”。該JavaScript庫。將打開“JavaScript. Libraries使用范圍”對(duì)話框。
3. 單擊  并選擇要包含在庫范圍中的文件或文件夾。IntelliJ IDEA將您帶回JavaScript Libraries Usage Scopes對(duì)話框，其中Path字段顯示所選文件或文件夾。
4. 對(duì)于每個(gè)添加的文件或文件夾，從“庫”列表中選擇要配置的庫。

示例：配置HTML和Node.js核心庫的范圍

在IntelliJ IDEA中處理全棧JavaScript應(yīng)用程序時(shí)，您經(jīng)常會(huì)注意到代碼完成建議客戶端代碼中的一些Node.js API和Node.js代碼中的DOM API。這是因?yàn)槟J(rèn)情況下在整個(gè)項(xiàng)目中啟用帶有DOM API的HTML庫和帶有Node.js API 的Node.js核心庫。要?jiǎng)h除不相關(guān)的完成建議，您需要配置這些庫的范圍。

1. 在“設(shè)置/首選項(xiàng)”對(duì)話框（Ctrl+Alt+S）中，單擊“語言和框架”下的“JavaScript” ，然后單擊“庫”。將打開“JavaScript. Libraries”頁面，其中顯示為當(dāng)前項(xiàng)目配置的所有庫。
   
   
2. 清除HTML和Node.js核心項(xiàng)旁邊的“已啟用”復(fù)選框。
3. 單擊“管理范圍”。將打開“JavaScript庫使用范圍”對(duì)話框。
4. 要配置HTML庫的范圍，請(qǐng)單擊 ，選擇具有客戶端代碼的文件夾，然后從“庫”下拉列表中選擇“HTML”。
5. 要配置Node.js核心庫的作用域，請(qǐng)?jiān)俅螁螕? ，選擇包含服務(wù)器端代碼的文件夾，然后從“庫”下拉列表中選擇“Node.js核心” 。
   
   
   現(xiàn)在IntelliJ IDEA解析了HTML和Node.js核心庫中的項(xiàng)目，并僅在這些所選項(xiàng)目文件夾的文件中建議它們完成。

配置通過CDN鏈接添加的庫

當(dāng)通過CDN鏈接引用.js庫文件時(shí)，它可用于運(yùn)行時(shí)，但對(duì)于IntelliJ IDEA是不可見的。要將此類庫.js文件中的對(duì)象添加到完成列表，請(qǐng)下載該文件并將其配置為外部庫。

下載庫

• 將光標(biāo)定位到庫的CDN鏈接，按Alt+Enter，然后從列表中選擇下載庫：
  
  
  該庫將下載到IntelliJ IDEA緩存（但不會(huì)下載到您的項(xiàng)目中），并顯示一條信息彈出消息：
  
  
  在JavaScript Libraries頁面上，下載的庫將添加到列表中，并在當(dāng)前項(xiàng)目的范圍內(nèi)啟用它：
  
  
  在“項(xiàng)目”工具窗口中，庫顯示在“外部庫”節(jié)點(diǎn)下：
  
  

更改庫的可見性

• 默認(rèn)情況下，IntelliJ IDEA將下載的庫標(biāo)記為全局，這意味著您可以在任何其他IntelliJ IDEA項(xiàng)目中啟用和重用它。要更改此默認(rèn)設(shè)置，請(qǐng)?jiān)诹斜碇羞x擇下載的庫，單擊“編輯”，然后在打開的“編輯庫”對(duì)話框中選擇“項(xiàng)目”。
  
  

配置自定義第三方JavaScript庫

假設(shè)您的項(xiàng)目或計(jì)算機(jī)上的其他地方有一個(gè)JavaScript框架文件，并且您希望IntelliJ IDEA將其視為庫，而不僅僅是您編輯的項(xiàng)目代碼。

配置自定義庫

1. 下載所需的框架文件。
2. 在“設(shè)置/首選項(xiàng)”對(duì)話框（Ctrl+Alt+S）中，單擊“語言和框架”下的“JavaScript” ，然后單擊“庫”。將打開“JavaScript. Libraries”頁面，單擊“添加”?！靶陆◣臁睂?duì)話框?qū)⒋蜷_。
3. 指定外部JavaScript庫的名稱，單擊 ，然后從列表中選擇“附加文件”或“附加目錄 ”。在打開的對(duì)話框中，選擇包含下載框架的文件或文件夾。
   
   

可選

• 默認(rèn)情況下，庫是Global，這意味著您可以將其附加到任何其他項(xiàng)目。要禁止重新使用庫，請(qǐng)?jiān)凇靶陆◣臁睂?duì)話框中選擇“項(xiàng)目”。
• 默認(rèn)情況下，庫在整個(gè)當(dāng)前項(xiàng)目的范圍內(nèi)啟用。您可以按配置庫的范圍中所述更改此默認(rèn)設(shè)置。
• 在“文檔URL”區(qū)域中，指定庫或框架的官方文檔的路徑。當(dāng)您此庫中的符號(hào)上按下Shift+F1時(shí)，IntelliJ IDEA將打開此URL 。

查看與文件關(guān)聯(lián)的庫

• 打開該文件在編輯或選擇該項(xiàng)目視圖，單擊狀態(tài)欄上的 。IntelliJ IDEA打開一個(gè)彈出窗口，列出與當(dāng)前文件關(guān)聯(lián)的庫。要更改列表，請(qǐng)單擊“范圍內(nèi)的庫”鏈接，然后在打開的“管理范圍”對(duì)話框中編輯范圍設(shè)置。
• 或者，在編輯器中打開文件，然后在上下文菜單中選擇“使用JavaScript庫 ”。IntelliJ IDEA打開一個(gè)包含可用配置庫的彈出列表。與當(dāng)前文件關(guān)聯(lián)的庫標(biāo)有勾號(hào)。
  • 要從庫的范圍中刪除當(dāng)前文件，請(qǐng)清除此庫旁邊的復(fù)選框。
  • 要將庫與當(dāng)前文件關(guān)聯(lián)，請(qǐng)選中此庫旁邊的復(fù)選框。

刪除庫

1. 在“設(shè)置/首選項(xiàng)”對(duì)話框（Ctrl+Alt+S）中，單擊“語言和框架”下的“JavaScript” ，然后單擊“庫”。將打開“JavaScript. Libraries”頁面，其中顯示了所有已有庫的列表。
2. 選擇所需的庫，然后單擊“刪除”。