IntelliJ IDEA使用文件觀察器

Tip：此功能僅在 Ultimate 版本中受支持！

IntelliJ IDEA 支持與各種在后臺運行的第三方編譯器集成，并且可以執(zhí)行以下操作：

⒈ 將Less、Sass、SCSS 和 Stylus 源代碼翻譯為 CSS 代碼。

⒉ 將 CoffeeScript 源代碼翻譯為 JavaScript 代碼，也可以創(chuàng)建源地圖來啟用調(diào)試。

⒊ 壓縮 JavaScript 和 CSS 代碼。

請注意，IntelliJ IDEA 不包含內(nèi)置編譯器，但僅支持與您必須下載并安裝在 IntelliJ IDEA 的外部工具的集成。

在 IntelliJ IDEA 中，這些編譯器配置稱為 "文件觀察器"。對于每個支持的編譯器，IntelliJ IDEA 提供了一個預定義的文件觀察程序模板。預定義文件觀察器模板在 IntelliJ IDEA 級別可用。要針對您的項目文件運行編譯器，您需要根據(jù)相關模板創(chuàng)建特定于項目的文件觀察器，至少要指定要在您的機器上使用的編譯器的路徑。

您可以下載一個您選擇的編譯器并將其設置為文件觀察器。但是，在這種情況下，沒有預定義的模板可用，因此您必須手動指定所有的設置。

為了適用，文件觀察器必須通過在設置對話框的文件觀察器頁面上選擇它旁邊的復選框來啟用，請參閱啟用和禁用文件觀察器。之后文件監(jiān)視器將在源代碼做出任何修改或保存時自動調(diào)用，具體取決于立即文件同步(Immediate File Synchronization)復選框是否被選中或清除，請參閱“新觀察器對話框”。

文件觀察器的輸出存儲在一個單獨的文件中。預定義的模板根據(jù)編譯器類型建議可以使用的文件的類型。默認情況下，當?shù)谝淮握{(diào)用文件觀察器時，輸出文件會在與輸入文件相同的文件夾中創(chuàng)建，于是這個文件只被更新。您可以在創(chuàng)建文件的過程中自定義所有這些設置。

由文件觀察器生成的 JavaScript 文件被排除在代碼完成和重構之外。

在項目樹視圖中，輸出文件顯示在原始文件的下方，顯示為一個節(jié)點。這是為了提高可視性，以便您可以更輕松地找到必要的文件。

文件觀察器有兩個專門的代碼檢查：

⒈ 在每個被識別為應用預定義的文件觀察器(Sass，Less，SCSS 或 CoffeeScript)的主題的文件中調(diào)用文件觀察器可用檢查。如果沒有適用的預定義文件觀察器與當前項目相關聯(lián)，IntelliJ IDEA 會建議添加一個。

⒉ 該“文件觀察器問題”檢查由運行的文件觀察器調(diào)用，并突出顯示特定的錯誤。

創(chuàng)建一個基于預定義模板的項目文件觀察器，請執(zhí)行以下常規(guī)步驟：

⒈ 確保要使用的編譯器被下載并安裝在您的計算機上。

⒉ 確保文件觀察器存儲庫插件已安裝并啟用。 插件沒有與 IntelliJ IDEA 捆綁在一起，但是可以從 JetBrains 插件倉庫中安裝，如“更新和卸載版本庫插件”與“啟用和禁用插件” 中所述安裝。

⒊ 指定文件觀察器的名稱、類型和說明。

⒋ 在選項區(qū)域，配置文件觀察器的行為：將調(diào)用它的事件，從哪個文件調(diào)用，何時顯示控制臺等等。

⒌ 在觀察器設置區(qū)域，配置與編譯器及其行為的交互：可執(zhí)行文件的路徑、傳遞給它的參數(shù)、可接受的輸入和預期的輸出文件類型等。

指定文件觀察器名稱、類型和說明

⒈ 通過按 Ctrl+Alt+S 或選擇：文件| 設置(Windows 和 Linux)或者選擇：IntelliJ IDEA | 首選項(MacOS)來打開“設置/首選項”對話框，然后單擊“工具”下的文件觀察器。

⒉ 打開的“文件觀察器”頁面顯示已經(jīng)在項目中配置的文件觀察器的列表。點擊添加按鈕 #FormatImgID_0#或按 Alt+Insert，然后執(zhí)行以下操作之一：

① 選擇用于創(chuàng)建文件觀察程序的預定義模板。這個選擇取決于您要使用的編譯器。

② 要設置您選擇的編譯器，請選擇“自定義”。

在您選擇相關的模板或自定義選項，新觀察器對話框打開。

⒊ 在 "名稱" 文本框中輸入文件觀察器的名稱。默認情況下，IntelliJ IDEA 建議您選擇選定的預定義模板的名稱。

配置文件觀察器的行為

在 "新觀察器" 對話框的 "選項" 區(qū)域中，配置 "文件觀察器" 的行為：將調(diào)用它的事件、可以從中調(diào)用的文件、要顯示的控制臺等。

⒈ 指定是否要讓文件觀察器與 IntelliJ IDEA 語法分析器進行交互：

① 要使文件觀察器忽略在語法上無效且僅在無錯誤的文件中啟動的文件中的 "更新、保存和更改焦點" 事件，請選擇“忽略語法錯誤的觸發(fā)觀察器”復選框。

② 要使文件觀察器啟動，而不管文件的語法正確性如何，請清除“忽略語法錯誤的觸發(fā)觀察器”復選框。該文件觀察器將在更新、保存或幀取消激活時啟動，具體取決于"立即文件同步" 復選框的狀態(tài)。

⒉ 指定文件觀察器將調(diào)用的事件：

① 當對源代碼進行任何更改時，文件觀察器就會被調(diào)用，選擇“即時的文件同步”復選框。

② 清除該復選框以使文件觀察器在保存時啟動(文件| 全部保存)，或者當您從 IntelliJ IDEA(在幀停用時)移動焦點。

⒊ 指定如何讓文件觀察器處理依賴關系。當文件觀察器在一個文件上被調(diào)用時，IntelliJ IDEA 會檢測包含這個文件的所有文件。對于這些文件中的每一個，IntelliJ IDEA 再次檢測到它所包含的文件。這個操作是遞歸重復的，直到 IntelliJ IDEA 到達在指定范圍內(nèi)不包含在任何地方的文件。這些文件被稱為根文件(不要與內(nèi)容根混淆)。

① 只針對根文件運行文件觀察器，選擇“只跟蹤根文件”復選框。

② 清除復選框以運行 File Watcher(文件觀察器)用于調(diào)用它的文件，以及對該文件在指定范圍內(nèi)遞歸的所有文件的調(diào)用。

該選項僅適用于 Babel、Closure Compiler、Compass、Jade、Less、Sass / SCSS、Stylus、UglifyJS 和 YUI Compressor JS。

⒋ 在“顯示控制臺”下拉列表中，指定何時顯示控制臺。可用的選項是：

① Always：當選擇這個選項時，文件觀察器在啟動時打開控制臺。

② Error：選擇此選項時， 僅當編譯中發(fā)生錯誤時，文件觀察器才會打開控制臺。

③ Never：在任何情況下選擇此選項來禁止打開控制臺。

⒌ 配置輸出過濾器以區(qū)分文件觀察器的輸出和其他輸出。這些過濾器為以下的基礎：

① 顯示文件觀察器輸出文件的路徑作為錯誤以及其他消息和日志的鏈接。當您點擊這個鏈接時，在編輯器中打開相應的文件。例如，要顯示有用的錯誤消息，請在正則表達式中指定以下表達式，以匹配添加/編輯過濾器對話框的輸出字段：

$FILE_PATH$:$LINE$ $MESSAGE$

② 在輸出文件中突出顯示錯誤。

點擊“輸出過濾器”按鈕打開輸出過濾器對話框并管理過濾器列表。

配置輸入文件的預期類型和位置

在“觀察文件”區(qū)域中，指定要由文件觀察器處理的文件的類型和位置。

⒈ 從文件類型下拉菜單中選擇輸入文件的預期類型。文件觀察器將僅考慮這種類型的文件作為分析和處理的對象。文件類型根據(jù)文件類型和文件擴展之間的關聯(lián)來識別。

默認情況下，該字段根據(jù)所選的預定義文件觀察器模板顯示文件類型。

⒉ 在“范圍”下拉列表中，定義文件觀察器可以應用到的文件的范圍。這些文件中的變化將立即調(diào)用文件觀察器，或者根據(jù)當前文件同步復選框的狀態(tài)，立即保存或幀停用。

您可以從下拉列表中選擇一個預定義的范圍：

① 項目文件：項目內(nèi)容根目錄中的所有文件(請參閱：內(nèi)容根和配置內(nèi)容根)。

② 項目生產(chǎn)文件：項目內(nèi)容根目錄下的所有文件，不包括測試源。

③ 項目測試文件：項目中的所有文件測試源根目錄。

④ 打開文件：當前在編輯器中打開的所有文件。

VCS 作用域：只有在項目處于版本控制的情況下，這些作用域才可用。

① 已更改的文件：所有已更改的文件，即與所有現(xiàn)有文件相關聯(lián)的所有文件更改列表。

② 默認值：所有與更改列表 Default相關的文件。

或者，點擊“瀏覽”按鈕并在打開的作用域?qū)υ捒蛑信渲米远x范圍。

有關范圍的更多詳細信息，請參閱“范圍和范圍對話框”頁面。

范圍設置覆蓋了僅跟蹤根文件復選框設置：如果依賴關系超出了指定范圍，則文件觀察器不適用于它。

配置與編譯器的交互

在“觀察器設置”區(qū)域中，配置與編譯器的交互：指定可執(zhí)行文件的路徑、傳遞給它的參數(shù)、可接受的輸入和預期的輸出文件類型等。

⒈ 在程序文本框中指定編譯器的可執(zhí)行文件的位置(.exe，.cmd，.bat ，或其他取決于特定工具，.jar的存檔也可以接受，但為它們定義PATH變量是不支持的)，執(zhí)行下列操作之一：

① 輸入路徑。

② 點擊瀏覽按鈕 打開“選擇路徑”對話框并導航到所需的位置。

③ 點擊“插入宏”按鈕打開宏對話框，您可以從列表中選擇相關的宏。

⒉ 在參數(shù)文本框中，在其他情況下定義要傳遞給編譯器的參數(shù)，使用此文本框來更改默認的輸出位置，即您指定一個自定義位置，用于編譯器在編譯過程中存儲生成的文件。請注意，如果您在這里重新定義了默認的輸出位置，則需要在“其他選項”區(qū)域中清除“從 stdout 創(chuàng)建輸出文件”復選框，否則生成的文件的內(nèi)容將被編譯器的輸出流覆蓋。

執(zhí)行以下操作之一：

① 在文本框中輸入?yún)?shù)列表。

② 點擊“插入宏”按鈕打開宏對話框，您可以從列表中選擇所需的宏。

指定參數(shù)時，請遵循以下規(guī)則：

① 使用空格來分隔各個參數(shù)。

② 如果參數(shù)包含空格，請使用雙引號將空格或包含空格的參數(shù)括起來，例如 some" "arg或"some arg"。

③ 如果參數(shù)包含雙引號(例如作為參數(shù)的一部分)，請使用反斜杠(例如：-Dmy.prop=\"quoted_value"\)將雙引號括起來。

⒊ 在“刷新文本框”的輸出路徑中，指定編譯器存儲其輸出的文件：生成的源代碼、源映射和依賴關系。基于這個設置，IntelliJ IDEA 檢測通過編譯生成的文件。

請注意，更改此文本框中的值并不能使編譯器將其輸出存儲在另一個位置。要做到這一點，在參數(shù)文本框中指定所需的輸出位置。

執(zhí)行以下操作之一：

① 手動輸入輸出路徑，使用冒號作為分隔符。

② 點擊“插入宏”按鈕打開“宏”對話框，您可以從列表中選擇所需的模式。

配置高級選項

在“其他選項”區(qū)域，指定高級編譯器配置設置。

⒈ 在“工作目錄”文本框中，指定編譯器要應用的目錄。由于該工具始終在文件的上下文中調(diào)用，因此默認的工作目錄是當前文件的目錄。此設置通過宏$ FileDir $來在所有預定義模板中指定。要更新此默認設置，請執(zhí)行以下操作之一：

① 在文本框中顯式鍵入路徑。

② 點擊瀏覽按鈕打開“選擇路徑”對話框并導航到所需的位置。

③ 點擊“插入宏”按鈕打開“宏”對話框，您可以從列表中選擇所需的宏。

如果該字段留空，IntelliJ IDEA 將使用文件觀察器被調(diào)用的文件所在的目錄。

⒉ 使用 stdout 復選框中的 Create output 文件來指定您想要生成的輸出文件。

① 要讓 IntelliJ IDEA 讀取本機編譯器的輸出(standard output stream (stdout))并從它生成結果文件，從 stdout 復選框中選擇 Create output file。

② 要讓編譯器將其輸出直接寫入到輸出路徑刷新字段指定的文件中，請清除復選框。

一些編譯器會生成一個standard output stream (stdout)文件，而其他的則不會，這可能會導致錯誤。因此，強烈建議保留默認設置。

⒊ 或者，可以定義環(huán)境變量。例如，為啟動編譯器所需的工具指定 PATH 變量， 但在路徑中未引用它。在大多數(shù)情況下，它是 Node.js 或 ruby.exe。如果您手動安裝編譯器，而不是通過節(jié)點包管理器或 gem Manager，并且它的安裝文件夾不在 Node.js 或 ruby，則這種情況可能會發(fā)生。

啟用和禁用文件觀察器

為了切換文件觀察器的啟用/禁用狀態(tài)，在設置對話框的文件觀察者頁面上選擇/清除復選框。如果在運行文件觀察器時發(fā)生了一個錯誤，則文件監(jiān)視器被自動禁用。要恢復狀態(tài)，請手動啟用文件觀察器。

當一個 “文件觀察器”已啟用，只要編輯適用的文件被更改或保存，它就會自動啟動，請參閱配置文件觀察器的行為。

自定義編譯器行為的示例

任何編譯器都是外部的第三方工具。因此影響編譯器的唯一方法就是將參數(shù)傳遞給它，就像您在命令行模式下工作一樣。這些參數(shù)對于每個工具都是特定的。下面是為 CoffeeScript 編譯器定制默認輸出位置的兩個示例。

假設，您有一個具有以下文件夾結構的項目：

默認情況下，生成的文件將存儲在原始文件所在的文件夾中。

您可以更改此默認位置并將生成的文件存儲在 js 文件夾中。而且，您可以將它們存儲在一個平面列表中，或者放置在重復 app 節(jié)點下的原始結構的文件夾結構中。

⒈ 要將所有生成的文件存儲在輸出 js 文件夾中而不保留該 app 文件夾下的原始文件夾結構：

① 在參數(shù)文本框中鍵入：

output $ProjectFileDir$\js\ --compile --map $FileName$

② 在輸出路徑刷新文本框，輸入：

$ProjectFileDir$\js\$FileNameWithoutExtension$.js:$ProjectFileDir$\js\$FileNameWithoutExtension$.map

結果，項目樹如下所示：

⒉ 要在輸出 js 文件夾中保留 app 節(jié)點下的原始文件夾結構，請執(zhí)行以下操作：

① 在參數(shù)文本框中鍵入：

output $ProjectFileDir$\js\$FileDirRelativeToProjectRoot$\ --compile --map $FileName$

② 在輸出路徑刷新文本框中，輸入：

$ProjectFileDir$\js\$FileDirRelativeToProjectRoot$\$FileNameWithoutExtension$.js:$ProjectFileDir$\js\$FileDirRelativeToProjectRoot$\$FileNameWithoutExtension$.map

結果，項目樹如下所示：