5.5. CodeReady Workspaces での Visual Studio Code 拡張機能のテスト
Visual Studio Code (VS Code) 拡張機能はワークスペースで機能します。VS Code 拡張機能は、Che-Theia エディターコンテナー、またはその前提条件を満たした独自の分離され、事前に設定されたコンテナーで実行されます。
本セクションでは、ワークスペースを使用して CodeReady Workspaces で VS Code 拡張をテストする方法と、VS Code 拡張の互換性を確認し、特定の API が利用可能かどうかを確認する方法を説明します。
extension-hosting サイドカーコンテナーおよび devfile での拡張機能の使用は任意です。
5.5.1. GitHub gist を使用した VS Code 拡張機能のテスト
各ワークスペースには独自のプラグインセットを使用できます。プラグインの一覧およびクローンを作成するプロジェクトの一覧は devfile.yaml
ファイルに定義されます。
たとえば、Red Hat CodeReady Workspaces ダッシュボードから AsciiDoc プラグインを有効にするには、以下のスニペットを devfile に追加します。
components: - id: joaopinto/vscode-asciidoctor/latest type: chePlugin
デフォルトのプラグインレジストリーにないプラグインを追加するには、カスタムプラグインレジストリーをビルドします。「レジストリーのカスタマイズ」または 「GitHub および gist サービスの使用」を参照してください。
前提条件
- CodeReady Workspaces の実行中のインスタンス。CodeReady Workspaces のインスタンスをインストールするには、「CodeReady Workspaces のインストール」を参照してください。
- GitHub アカウント。
手順
-
gist の Web
ページに移動し、Red Hat CodeReady Workspaces の Try Bracket Pair Colorizer 拡張と
(ブラケット Pair Colorizer は一般的な VS Code 拡張機能です。)、Example VS Code 拡張機能で
README.md
ファイルを作成します。 - Create secret gist ボタンをクリックします。
ブラウザーのナビゲーションバーの URL を使用して、gist リポジトリーのクローンを作成します。
$ git clone https://gist.github.com/<your-github-username>/<gist-id>
git clone
コマンドの出力例git clone https://gist.github.com/benoitf/85c60c8c439177ac50141d527729b9d9 1 Cloning into '85c60c8c439177ac50141d527729b9d9'... remote: Enumerating objects: 3, done. remote: Counting objects: 100% (3/3), done. remote: Total 3 (delta 0), reused 0 (delta 0), pack-reused 0 Unpacking objects: 100% (3/3), done.
- 1
- 各 gist には固有の ID があります。
ディレクトリーを変更します。
$ cd <gist-directory-name> 1
- 1
- gist ID に一致するディレクトリー名。
- VS Code marketplace または GitHub ページからプラグインをダウンロードし、プラグインファイルをクローン作成されたディレクトリーに保存します。
クローン作成されたディレクトリーに
plugin.yaml
ファイルを作成して、このプラグインの定義を追加します。バイナリーファイルの拡張を参照する
plugin.yaml
ファイルの例apiVersion: v2 publisher: CoenraadS name: bracket-pair-colorizer version: 1.0.61 type: VS Code extension displayName: Bracket Pair Colorizer title: Bracket Pair Colorizer description: Bracket Pair Colorizer icon: https://raw.githubusercontent.com/redhat-developer/codeready-workspaces/master/dependencies/che-plugin-registry/resources/images/default.svg?sanitize=true repository: https://github.com/CoenraadS/BracketPair category: Language firstPublicationDate: '2020-07-30' spec: 1 extensions: - "{{REPOSITORY}}/CoenraadS.bracket-pair-colorizer-1.0.61.vsix" 2 latestUpdateDate: "2020-07-30"
メモリー制限およびボリュームを定義します。
spec: containers: - image: "quay.io/eclipse/che-sidecar-java:8-0cfbacb" name: vscode-java memoryLimit: "1500Mi" volumes: - mountPath: "/home/theia/.m2" name: m2
plugin.yaml ファイルを参照する devfile
.yamlapiVersion: 1.0.0 metadata: generateName: java-maven- projects: - name: console-java-simple source: type: git location: "https://github.com/che-samples/console-java-simple.git" branch: java1.11 components: - type: chePlugin id: redhat/java11/latest - type: chePlugin 1 reference: "{{REPOSITORY}}/plugin.yaml" - type: dockerimage alias: maven image: quay.io/eclipse/che-java11-maven:nightly memoryLimit: 512Mi mountSources: true volumes: - name: m2 containerPath: /home/user/.m2 commands: - name: maven build actions: - type: exec component: maven command: "mvn clean install" workdir: ${CHE_PROJECTS_ROOT}/console-java-simple - name: maven build and run actions: - type: exec component: maven command: "mvn clean install && java -jar ./target/*.jar" workdir: ${CHE_PROJECTS_ROOT}/console-java-simple
- 1
- その他の devfile 定義も使用できます。この devfile の重要な情報は、この外部コンポーネントを定義する行になります。これは、外部参照がデフォルトのプラグインレジストリーの定義を参照する ID ではなく、プラグインを定義することを意味します。
現在の Git ディレクトリーに 4 つのファイルがあることを確認します。
$ ls -la .git CoenraadS.bracket-pair-colorizer-1.0.61.vsix README.md devfile.yaml plugin.yaml
ファイルをコミットする前に、事前コミットフックを追加して
{{REPOSITORY}}
変数を公開されている外部 raw gist リンクに更新します。以下の内容で.git/hooks/pre-commit
ファイルを作成します。#!/bin/sh # get modified files FILES=$(git diff --cached --name-only --diff-filter=ACMR "*.yaml" | sed 's| |\\ |g') # exit fast if no files found [ -z "$FILES" ] && exit 0 # grab remote origin origin=$(git config --get remote.origin.url) url="${origin}/raw" # iterate on files and add the good prefix pattern for FILE in ${FILES}; do sed -e "s#{{REPOSITORY}}#${url}#g" "${FILE}" > "${FILE}.back" mv "${FILE}.back" "${FILE}" done # Add back to staging echo "$FILES" | xargs git add exit 0
フックは
{{REPOSITORY}}
マクロを置き換え、外部の未加工リンクを gist に追加します。スクリプトを実行可能にします。
$ chmod u+x .git/hooks/pre-commit
ファイルをコミットし、プッシュします。
# Add files $ git add * # Commit $ git commit -m "Initial Commit for the test of our extension" [master 98dd370] Initial Commit for the test of our extension 3 files changed, 61 insertions(+) create mode 100644 CoenraadS.bracket-pair-colorizer-1.0.61.vsix create mode 100644 devfile.yaml create mode 100644 plugin.yaml # and push the files to the main branch $ git push origin
gist の Web サイトにアクセスし、すべてのリンクに正しい公開 URL
があり、{{REPOSITORY}}
変数が含まれていないことを確認します。devfile に到達するには、以下を実行します。$ echo "$(git config --get remote.origin.url)/raw/devfile.yaml"
または
$ echo "https://<che-server>/#$(git config --get remote.origin.url)/raw/devfile.yaml"