在che中增長EMF支持 - Day5：建立一個插件並註冊一種文件類型

咱們下一步主要的目標是爲在Che中添加一個可以編輯EMF模型的自定義的編輯器。爲了完成這個，咱們首先爲Che建立一個自定義的插件，這樣咱們就不會將咱們的代碼和che的核心代碼混淆。在咱們第一個插件中，咱們將對Che進行兩個擴展：註冊.ecore文件做爲一個自定義的文件類型，併爲這個文件類型註冊一個自定義的編輯器。咱們將詳細的描述這兩個插件，由於他們將會是之後的擴展的一個模板。

Che裏面的插件基本都是加到咱們自定義build裏的maven模板。注意Che沒有運行時能夠添加的插件。

咱們將手動將模塊整合進Che build的過程裏，但這會須要一些人工的工做。幸運的是，Che提供了一個簡單的方式：會用maven archtypes生成一個簡單的插件，能夠做爲您本身的插件的基礎。

如下描述基於Eclipse Che（5.13.0）。

執行下面的步驟。

1. 複製git clone https://github.com/eclipse/che-archetypes.git
2. 切換到Clone的項目目錄
3. 確認版本號git checkout tags/5.13.0

4. 執行下面的指令：

   mvn org.apache.maven.plugins:maven-archetype-plugin:2.4:generate -DarchetypeRepository=https://maven.codenvycorp.com/content/groups/public/ -DarchetypeGroupId=org.eclipse.che.archetype -DarchetypeArtifactId=plugin-menu-archetype -DarchetypeVersion=5.13.0 -DgroupId=my.plugin -DartifactId=my-sample-plugin -Dversion=0.1-SNAPSHOT -DskipITs -DinteractiveMode=false

這將在「my-sample-plugin」目錄中生成一個示例插件。 該示例包含一個菜單項，觸發「Hello from Che !!!」輸出。 您能夠瀏覽插件目錄以瞭解有關示例代碼的更多信息。

想要用che構建這個插件，切換到my-sample-plugin目錄並執行：

mvn clean install

最後，在my-sample-plugin目錄中執行以下指令來啓動Che（$PWD指當前目錄）。

docker run -it --rm -v /var/run/docker.sock:/var/run/docker.sock -v $PWD/mydata:/data -v $PWD/assembly-che/assembly-main/target/eclipse-che-0.1-SNAPSHOT/eclipse-che-0.1-SNAPSHOT:/assembly eclipse/che-cli:5.13.0 start

如今，在「https：// localhost：8080」打開瀏覽器並建立一個新工做區。 您能夠看到生成的示例菜單和操做。

如今咱們有了一個正在運行的插件，讓咱們回到咱們最初的目標:Che內的EMF支持。咱們將使用該插件爲Che添加一些擴展：自定義文件類型和自定義編輯器。

目前，沒有任何擴展名，Che顯示「.ecore」擴展名的通用文件圖標以下圖：

做爲下一個示例，咱們要註冊文件擴展名「.ecore」並顯示適當的圖標。

首先，咱們將咱們的圖標添加到插件目錄my-sample-plugin/plugins/my-sample-plugin/my-sample-plugin-ide/src/main/resources。

而後，咱們須要在GWT中加載圖標。爲此，咱們在my.plugin.ide包中建立了一個新的界面IconResource.java，其中包含如下內容：

package my.plugin.ide;
import com.google.gwt.core.client.GWT;
import com.google.gwt.resources.client.ClientBundle;
import org.vectomatic.dom.svg.ui.SVGResource;
public interface IconResource extends ClientBundle {
   IconResource INSTANCE = GWT.create(IconResource.class);
   @Source("icon.svg")
   SVGResource icon();
}

因爲咱們在org.vectomatic.dom.svg中添加了一個依賴項，咱們須要在my-sample-plugin-ide/pom.xml中添加這個依賴項。

org.vectomatic
   lib-gwt-svg
   0.5.12

這樣，咱們就定義了自定義文件類型，並將其加入到Gin模塊中。打開SampleMenuGinModule.java並添加下面的代碼，代碼內容基本上是爲自定義文件類型的一個小工廠：包括了文件類型相關的圖標和擴展名。

@Provides
@Singleton
@Named("EcoreFileType")
protected FileType provideEcoreFile(IconResource res) {
   return new FileType(res.icon(), "ecore");
}

最後，咱們須要註冊文件類型併爲其註冊編輯器。如今咱們直接將Che的默認文本編輯器做爲編輯器，以後咱們將使用這段代碼將咱們自定義的編輯器做爲默認的。

爲了進行註冊，咱們建立一個新的java類MyEditorExtension.java。這個擴展類是插件與Che交互的核心位置。這將容許咱們在此到處理一切相關的事情，好比文件類型、編輯器、操做、視圖等等。

標記@Extension告訴Che，這個類提供了擴展。全部方法都將經過dependency injection方式執行，容許您加入全部必需的參數和服務。 在下面的示例中，咱們加入兩個Che服務：編輯器註冊表和文件類型註冊表，以及咱們的自定義文件類型。首先，咱們將自定義文件類型添加到文件類型註冊表中，其次，咱們將自定義文件類型與默認文本編輯器相關聯。

@Extension(title = "Ecore Editor")
public class MyEditorExtension {
   @Inject
   public void registerForFiletype(final EditorRegistry editorRegistry,
                                   final FileTypeRegistry fileTypeRegistry,
                                   final @Named("EcoreFileType") FileType ecoreFile,
                                   final DefaultTextEditorProvider provider
                                   ){
       fileTypeRegistry.registerFileType(ecoreFile);
       editorRegistry.registerDefaultEditor(ecoreFile,provider);
   }
}

如今咱們重建Che，全部使用文件擴展名「.ecore」的文件都將使用自定義圖標並打開默認文本編輯器：

在這篇博文中，咱們爲Che建立了一個插件，容許咱們添加自定義內容，而無需將咱們的代碼與Che代碼混合。到目前爲止，咱們的自定義內容很簡單，加了一個圖表和註冊了一個默認編輯器。但咱們的最終目標是添加自定義編輯器，使得你可以在Eclipse的桌面IDE中同樣修改Ecore文件。有幾種不一樣的方法來開發這樣的編輯器，咱們將在本博客的下一部分介紹。