VS Code用GitLab Workflow拡張機能
Visual Studio Code用GitLab Workflow拡張機能は、GitLab Duoやその他のGitLabの機能をIDEに直接統合します。GitLab WorkflowパネルがVS Codeのサイドバーに追加されます。このパネルでは、イシュー、マージリクエスト、パイプラインを表示し、カスタムクエリで表示を拡張することができます。
利用を開始するには、拡張機能をインストールして設定します。
設定が完了すると、この拡張機能により、日常的に使用するGitLabの機能がVS Code環境に直接組み込まれます:
- イシューを作成し、表示します。
- マージリクエストを作成、表示、レビューします。
- Visual Studio Codeコマンドパレットから一般的なコマンドを実行する。
- GitLab CI/CD設定をテストする。
- パイプラインのステータスとジョブの出力を表示する。
- スニペットを作成および管理する。
- リポジトリをクローンせずに参照する。
- セキュリティ検出結果を表示する。
- SASTスキャンを実行する。
さらに、GitLab Workflow拡張機能は、AIアシスト機能によってVS Codeのワークフローを効率化します:
- GitLab Duo Chat: VS Code内でAIアシスタントと直接やり取りできます。
- GitLab Duoコード提案: 現在のコード行に対する補完が提案されます。また、自然言語でコードコメントを書くと、より具体的な提案が得られます。
VS CodeでGitLabプロジェクトを表示すると、拡張機能は現在のブランチに関する情報を表示します:
- ブランチの最新のCI/CDパイプラインのステータス。
- このブランチのマージリクエストへのリンク。
- マージリクエストにイシューのクローズパターンが含まれている場合は、そのイシューへのリンク。
VS CodeでGitLabアカウントを切り替える
GitLab Workflow拡張機能は、VS Codeワークスペース(ウィンドウ)ごとに1つのアカウントを使用します。この拡張機能は、次の場合にアカウントを自動的に選択します:
- 拡張機能にGitLabアカウントを1つだけ追加した場合。
- VS Codeウィンドウ内のすべてのワークスペースが、
git remoteの設定に基づいて同じGitLabアカウントを使用している場合。
拡張機能がステータスバーに表示する内容は、アカウントの設定によって異なります:
- GitLabアカウントが1つしかない場合、ステータスバーには何も表示されません。
- 複数のGitLabアカウントが存在し、拡張機能が使用するアカウントを特定できる場合、ステータスバーにはタヌキ( )アイコンの横にアカウント名が表示されます。
- 複数のGitLabアカウントが存在し、拡張機能が使用するアカウントを特定できない場合、ステータスバーにMultiple GitLab Accounts(複数のGitLabアカウント)( )と表示されます。
アクティブなVS Codeウィンドウで使用するGitLabアカウントを選択するには、ステータスバーのアイテムを選択するか、次の手順に従います:
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- コマンド
GitLab: Select Account for this Workspaceを実行します。 - リストから使用するアカウントを選択します。
GitLabプロジェクトを選択する
Gitリポジトリが複数のGitLabプロジェクトに関連付けられている場合、拡張機能は使用するアカウントを判断できません。これは、次のように複数のリモートがある場合に発生する可能性があります:
origin:git@gitlab.com:gitlab-org/gitlab-vscode-extension.gitpersonal-fork:git@gitlab.com:myusername/gitlab-vscode-extension.git
このような場合、拡張機能は**(multiple projects)**(複数のプロジェクト)ラベルを追加して、アカウントを選択する必要があることを示します。
アカウントを選択するには、次の手順に従います:
垂直メニューバーでGitLab Workflow( )を選択して、拡張機能のサイドバーを表示します。
Issues and Merge Requests(イシューとマージリクエスト)を展開します。
(multiple projects, click to select)(複数プロジェクト、クリックして選択)を含む行を選択します。
ご希望のプロジェクトを選択します:
Issues and Merge requests(イシューとマージリクエスト)リストが、選択したプロジェクトの情報で更新されます。
選択内容を変更する
プロジェクトの選択を変更するには、次の手順に従います:
- 垂直メニューバーでGitLab Workflow( )を選択して、拡張機能のサイドバーを表示します。
- Issues and Merge Requests(イシューとマージリクエスト)を展開して、プロジェクトリストを表示します。
- プロジェクトを選択します。
- プロジェクト名の横にあるClear Selected Project を選択します。
スラッシュコマンドを使用する
イシューとマージリクエストでは、VS Codeでアクションを直接実行できるように、GitLabのスラッシュコマンドがサポートされています。
スニペットを作成する
スニペットを作成して、コードやテキストの一部を保存し、他のユーザーと共有できます。スニペットは、選択範囲またはファイル全体を指定して作成できます。
VS Codeでスニペットを作成するには、次の手順に従います:
- スニペットの内容を選択します:
- Snippet from file(ファイルからスニペット)を作成する場合は、ファイルを開きます。
- Snippet from selection(選択範囲からスニペット)を作成する場合は、ファイルを開き、含める行を選択します。
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- コマンドパレットで、コマンド
GitLab: Create Snippetを実行します。 - スニペットのプライバシーレベルを選択します:
- プライベートスニペットは、プロジェクトメンバーのみに表示されます。
- 公開スニペットは、すべてのユーザーに表示されます。
- スニペットのスコープを選択します:
- Snippet from file(ファイルからスニペット)を作成する場合は、アクティブなファイル全体の内容を使用します。
- Snippet from selection(選択範囲からスニペット)を作成する場合は、アクティブなファイルで選択した行を使用します。
GitLabは、新しいブラウザタブで新しいスニペットのページを開きます。
パッチファイルを作成する
マージリクエストをレビューするとき、複数のファイルにわたる変更を提案する場合は、スニペットパッチを作成します。
- ローカルマシンで、変更を提案するブランチをチェックアウトします。
- VS Codeで、変更するすべてのファイルを編集します。変更をコミットしないでください。
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- コマンドパレットで、
GitLab: Create snippet patchと入力し、候補に表示されたコマンドを選択します。このコマンドはgit diffコマンドを実行し、プロジェクト内にGitLabスニペットを作成します。 - Patch name(パッチ名)を入力し、Enterキーを押します。GitLabはこの名前をスニペットのタイトルとして使用し、拡張子
.patchが付加されたファイル名に変換します。 - スニペットのプライバシーレベルを選択します:
- プライベートスニペットは、プロジェクトメンバーのみに表示されます。
- 公開スニペットは、すべてのユーザーに表示されます。
VS Codeは、新しいブラウザタブでスニペットパッチを開きます。スニペットパッチの説明には、パッチを適用する手順が記載されています。
スニペットを挿入する
メンバーになっているプロジェクトから既存の単一ファイルまたは複数ファイルのスニペットを挿入するには、次の手順に従います:
- スニペットを挿入する位置にカーソルを置きます。
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
GitLab: Insert Snippetと入力し、候補に表示されたコマンドを選択します。- スニペットを含むプロジェクトを選択します。
- 適用するスニペットを選択します。
- 複数ファイルのスニペットの場合は、適用するファイルを選択します。
イシューとマージリクエストを表示する
特定のプロジェクトのイシューとマージリクエストを表示するには、次の手順に従います:
- メニューバーでGitLab Workflow( )を選択して、拡張機能のサイドバーを表示します。
- サイドバーでイシューとマージリクエストを展開します。
- 目的のプロジェクトを選択して展開します。
- 次のいずれかの結果タイプを選択します:
- 自分にアサインされたイシュー
- Issues created by me(Issues created by me(自分が作成したイシュー))
- 自分にアサインされたマージリクエスト
- Merge requests I’m reviewing(Merge requests I’m reviewing(自分がレビュー中のマージリクエスト))
- Merge requests created by me(Merge requests created by me(自分が作成したマージリクエスト))
- All project merge requests(All project merge requests(プロジェクトのすべてのマージリクエスト))
- Your custom queries(自分のカスタムクエリ)
イシューまたはマージリクエストを選択すると、新しいVS Codeタブで開きます。
イシューを作成
現在のプロジェクトでイシューを作成するには:
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- コマンドパレットでGitLab: 現在のプロジェクトで新しいイシューを作成し、Enterキーを押します。
GitLabにより、新規イシューページがデフォルトのブラウザで開きます。
マージリクエストを作成する
現在のプロジェクトでマージリクエストを作成するには、下のステータスバーでCreate MR(MRの作成) ( ) を選択するか、または以下の手順に従ってください:
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- コマンドパレットでGitLab: 現在のプロジェクトから新しいマージリクエストを作成し、Enterキーを押します。
GitLabにより、新しいマージリクエストページがデフォルトのブラウザで開きます。
マージリクエストをレビューする
この拡張機能を使用すると、VS Codeを離れることなく、マージリクエストのレビュー、コメント、承認を行えます:
GitLab Workflowサイドバーで、Issues and Merge Requests(イシューとマージリクエスト)を展開し、プロジェクトを選択します。
レビューするマージリクエストを選択します。そのサイドバーのエントリが展開され、詳細情報が表示されます。
マージリクエストの番号とタイトルの下にある説明を選択して、マージリクエストの詳細を確認します。
提案されたファイルの変更をレビューするには、リストからファイルを選択してVS Codeタブに表示します。GitLabは、差分コメントをタブ内にインライン表示します。リストでは、削除されたファイルは赤色で表示されます:
差分を使用して次の操作を行います:
- ディスカッションをレビューおよび作成する。
- ディスカッションを解決および再オープンする。
- 個々のコメントを削除および編集する。
デフォルトブランチと比較する
マージリクエストを作成せずに、自分のブランチをプロジェクトのデフォルトブランチと比較するには、次の手順に従います:
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- コマンドパレットでGitLab: Compare current branch with master(GitLab: 現在のブランチをマスターと比較する)を検索し、Enterキーを押します。
拡張機能が新しいブラウザタブを開き、自分のブランチの最新コミットと、プロジェクトのデフォルトブランチの最新コミットの差分を表示します。
GitLab UIで現在のファイルを開く
現在のGitLabプロジェクトのファイルをGitLab UIで開き、特定の行を強調表示するには、次の手順に従います:
- VS Codeで目的のファイルを開きます。
- 強調表示する行を選択します。
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- コマンドパレットでGitLab: Open active file on GitLab(GitLab: GitLabでアクティブなファイルを開く)を選択し、Enterキーを押します。
セキュリティ検出結果を表示する
- プラン: Ultimate
- 提供形態: GitLab.com、GitLab Self-Managed、GitLab Dedicated
前提要件:
- GitLab Workflowバージョン3.74.0以降を使用していること。
- プロジェクトには、静的アプリケーションセキュリティテスト(SAST)、動的アプリケーションセキュリティテスト(DAST)、コンテナスキャン、または依存関係スキャンなどのセキュリティリスク管理機能が含まれています。
- セキュリティリスク管理機能が設定されていることを確認してください。
セキュリティ検出結果を表示するには、次の手順に従います:
- 垂直メニューバーでGitLab Workflow( )を選択して、拡張機能のサイドバーを表示します。
- サイドバーでセキュリティスキャンを展開します。
- New findings(新しい検出結果)またはFixed findings(修正された検出結果)のいずれかを選択します。
- 表示する重大度レベルを選択します。
- 検出結果を選択すると、VS Codeタブで開きます。
SASTスキャンを実行する
- プラン: Ultimate
- 提供形態: GitLab.com
- ステータス: 実験的機能
VS Codeの静的アプリケーションセキュリティテスト(SAST)は、アクティブなファイルの脆弱性を検出します。早期に検出することで、変更をデフォルトブランチにマージする前に脆弱性を修正できます。
SASTスキャンをトリガーすると、アクティブなファイルの内容がGitLabに渡され、SAST脆弱性ルールに照らしてチェックされます。GitLabは、プライマリサイドバーにスキャン結果を表示します。
SASTスキャンのセットアップについては、GitLab UnfilteredのSAST scanning in VS Code(VS CodeでのSASTスキャン)を参照してください。
前提要件:
- GitLab Workflowバージョン5.31.0以降を使用していること。
- GitLabに対して認証済みであること。
- Enable Real-time SAST scan checkbox(リアルタイムSASTスキャンを有効にする)チェックボックスをオンにしていること。
VS CodeでファイルのSASTスキャンを実行するには、次の手順に従います:
ファイルを開きます。
次のいずれかの方法でSASTスキャンをトリガーします:
- ファイルを保存する(Enable scanning on file save(ファイルの保存時にスキャンを有効にする)オプションをオンにしている場合)。
- コマンドパレットを使用する:
- コマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- GitLab: Run Remote Scan (SAST)(GitLab: リモートスキャン(SAST)を実行する)を検索し、Enterキーを押します。
- コマンドパレットを開きます:
SASTスキャンの結果を表示します。
- Primary Side Bar(プライマリサイドバー)を表示します。
- GitLab Workflow( )を選択して、拡張機能のサイドバーを表示します。
- GITLAB REMOTE SCAN (SAST)(GitLabリモートスキャン(SAST))セクションを展開します。
SASTスキャンの結果は、重大度の降順で一覧表示されます。検出結果の詳細を表示するには、拡張機能のサイドバーのGITLAB REMOTE SCAN (SAST)(GitLabリモートスキャン(SAST))セクションで検出結果を選択します。
イシューとマージリクエストを検索する
VS Codeからプロジェクトのイシューとマージリクエストを直接検索するには、フィルター検索または高度な検索を使用します。フィルター検索では、定義済みのトークンを使用して検索結果を絞り込みます。高度な検索では、GitLabインスタンス全体をより高速かつ効率的に検索できます。
前提要件:
- GitLabプロジェクトのメンバーであること。
- GitLab Workflow拡張機能をインストールしていること。
- GitLabに対して認証するの説明に従って、GitLabインスタンスにサインインしていること。
プロジェクトのタイトルと説明フィールドを検索するには、次の手順に従います:
- VS Codeでコマンドパレットを開きます:
- macOSの場合は、Command+Shift+Pキーを押します。
- WindowsまたはLinuxの場合は、Command+Shift+Pキーを押します。
- 目的の検索タイプ(
GitLab: Search project merge requests(GitLab: プロジェクトのマージリクエストを検索)またはGitLab: Search project issues(GitLab: プロジェクトのイシューを検索))を選択します。 - テキストを入力し、必要に応じてフィルタートークンを使用します。
- 検索テキストを確定するには、Enterキーを押します。キャンセルするには、Escapeキーを押します。
GitLabがブラウザタブで結果を開きます。
トークンで検索をフィルタリングする
大規模なプロジェクトで検索する際は、フィルターを追加するとより適切な結果が得られます。この拡張機能は、マージリクエストとイシューをフィルタリングするための次のトークンをサポートしています:
| トークン | 例 | 説明 |
|---|---|---|
| assignee | assignee: timzallmann | 担当者のユーザー名(@なし)。 |
| author | author: fatihacet | 作成者のユーザー名(@なし)。 |
| label | label: frontendまたはlabel:frontend label: Discussion | 1つのラベル。複数回使用でき、同じクエリでlabelsと併用できます。 |
| labels | labels: frontend, Discussion, performance | 複数のラベルのカンマ区切りリスト。同じクエリでlabelと併用できます。 |
| milestone | milestone: 18.1 | マイルストーンのタイトル(%なし)。 |
| scope | scope: created-by-me、scope: assigned-to-me、またはscope: all。 | 指定されたスコープに一致するイシューとマージリクエスト。値: created-by-me(デフォルト)、assigned-to-me、またはall。 |
| title | title: discussions refactor | タイトルまたは説明にこれらの単語を含むイシューとマージリクエスト。フレーズを引用符で囲まないでください。 |
トークンの構文とガイドライン:
- 各トークン名の後にはコロン(
:)が必要です(例:label:)。- コロンの前にスペースを入れる(
label :)と無効になり、解析エラーが返されます。 - トークン名の後のスペースは省略可能です。
label: frontendとlabel:frontendはいずれも有効です。
- コロンの前にスペースを入れる(
labelトークンとlabelsトークンは複数回使用でき、また組み合わせて使用することもできます。次のクエリはいずれも同じ結果を返します:labels: frontend discussion label: performancelabel: frontend label: discussion label: performancelabels: frontend discussion performance(最終的に得られる結合クエリ)
1つの検索クエリで複数のトークンを組み合わせることができます。次に例を示します:
title: new merge request widget author: fatihacet assignee: jschatz1 labels: frontend, performance milestone: 17.5この検索クエリは、次の条件に一致するものを探します:
- タイトル:
new merge request widget - 作成者:
fatihacet - 担当者:
jschatz1 - ラベル:
frontendとperformance - マイルストーン:
17.5
キーボードショートカットをカスタマイズする
Accept Inline Suggestion(インライン提案を受け入れる)、Accept Next Word Of Inline Suggestion(インライン提案の次の単語を受け入れる)、またはAccept Next Line Of Inline Suggestion(インライン提案の次の行を受け入れる)に対して、別のキーボードショートカットを割り当てることができます:
- VS Codeで
Preferences: Open Keyboard Shortcutsコマンドを実行します。 - 編集するショートカットを見つけて、Change keybinding(キー割り当てを変更)( )を選択します。
- 使用するショートカットをAccept Inline Suggestionインライン提案を受け入れる)、Accept Next Word Of Inline Suggestion(インライン提案の次の単語を受け入れる)、またはAccept Next Line Of Inline Suggestion(インライン提案の次の行を受け入れる)に割り当てます。
- Enterキーを押して変更を保存します。
拡張機能を更新する
拡張機能を最新バージョンに更新するには、次の手順に従います:
- Visual Studio Codeで、設定 > Extensions(拡張機能)に移動します。
- GitLab (
gitlab.com)が発行するGitLab Workflowを検索します。 - Extension: GitLab Workflow(拡張機能: GitLab Workflow)で、Update to {later version}({新しいバージョン}に更新)を選択します。
- オプション。今後の自動更新を有効にするには、Auto-Updateを選択します。
ステータスを確認する
- Visual Studio Codeの下部ステータスバーで、GitLabアイコン( )を選択します。
- VS Codeの検索ボックスの下にメニューが表示され、GitLab Workflow拡張機能のステータスが表示されます。エラーがある場合は**ステータス:**の横に表示されます。
GitLab Duo Chatのステータスも確認できます。
テレメトリを有効にする
GitLab Workflow拡張機能は、Visual Studio Codeのテレメトリ設定を使用して、使用状況とエラー情報をGitLabに送信します。Visual Studio Codeでテレメトリを有効化またはカスタマイズするには、次の手順に従います:
- Visual Studio Codeで、Windows/Linuxの場合はファイル > 設定 > 設定に移動します。macOSの場合はコード > 設定 > 設定に移動します。
- 検索ボックスで、
Telemetryを検索します。 - 左側のサイドバーで、Telemetry(テレメトリ)を選択します。
- Telemetry Level(テレメトリレベル)で、共有するデータを選択します:
all: 使用状況データ、一般的なエラーテレメトリ、クラッシュレポートを送信します。error: 一般的なエラーテレメトリとクラッシュレポートを送信します。crash: OSレベルのクラッシュレポートを送信します。off: Visual Studio Codeのすべてのテレメトリデータを無効にします。
- 変更を保存します。


