🚀 VS Code でで入手しましょう!

継続的インテグレーション

拡張機能の統合テストは、CI サービスで実行できます。@vscode/test-electron ライブラリは、CI プロバイダーでの拡張機能テストのセットアップを支援し、Azure Pipelines 上のサンプル拡張機能のセットアップを含んでいます。ビルドパイプラインを確認するか、azure-pipelines.yml ファイルに直接ジャンプできます。

自動公開

CI を構成して、拡張機能の新しいバージョンを自動的に公開することもできます。

公開コマンドは、vsce を使用してローカル環境から公開するのと似ていますが、何らかの方法で Personal Access Token (PAT) を安全な方法で提供する必要があります。PAT を VSCE_PAT シークレット変数として保存することにより、vsce はそれを使用できるようになります。シークレット変数は公開されることがないため、CI パイプラインで安全に使用できます。

Azure Pipelines

Azure Pipelines

Azure Pipelines は、Windows、macOS、Linux でのテスト実行をサポートしているため、VS Code 拡張機能のテストを実行するのに最適です。オープンソースプロジェクトの場合、無制限の時間と 10 個の無料並列ジョブが提供されます。このセクションでは、拡張機能のテストを実行するための Azure Pipelines の設定方法について説明します。

まず、Azure DevOps で無料アカウントを作成し、拡張機能用のAzure DevOps プロジェクトを作成します。

次に、次の azure-pipelines.yml ファイルを拡張機能リポジトリのルートに追加します。ヘッドレス Linux CI マシンで VS Code を実行するために必要な Linux 用の xvfb セットアップスクリプトを除けば、定義は簡単です。

trigger:
  branches:
    include:
    - main
  tags:
    include:
    - v*

strategy:
  matrix:
    linux:
      imageName: 'ubuntu-latest'
    mac:
      imageName: 'macos-latest'
    windows:
      imageName: 'windows-latest'

pool:
  vmImage: $(imageName)

steps:

- task: NodeTool@0
  inputs:
    versionSpec: '10.x'
  displayName: 'Install Node.js'

- bash: |
    /usr/bin/Xvfb :99 -screen 0 1024x768x24 > /dev/null 2>&1 &
    echo ">>> Started xvfb"
  displayName: Start xvfb
  condition: and(succeeded(), eq(variables['Agent.OS'], 'Linux'))

- bash: |
    echo ">>> Compile vscode-test"
    yarn && yarn compile
    echo ">>> Compiled vscode-test"
    cd sample
    echo ">>> Run sample integration test"
    yarn && yarn compile && yarn test
  displayName: Run Tests
  env:
    DISPLAY: ':99.0'

最後に、DevOps プロジェクトで新しいパイプラインを作成し、azure-pipelines.yml ファイルを指すようにします。ビルドをトリガーすると、ほら、できあがりです。

pipelines

ブランチへのプッシュ時やプルリクエスト時にもビルドを継続的に実行できるようにすることができます。詳細については、ビルドパイプラインのトリガーを参照してください。

Azure Pipelines の自動公開

  1. Azure DevOps シークレットの手順を使用して、VSCE_PAT をシークレット変数として設定します。
  2. vscedevDependencies としてインストールします (npm install @vscode/vsce --save-dev または yarn add @vscode/vsce --dev)。
  3. PAT なしで package.jsondeploy スクリプトを宣言します (デフォルトでは、vsce は Personal Access Token として VSCE_PAT 環境変数を使用します)。
"scripts": {
  "deploy": "vsce publish --yarn"
}
  1. タグが作成されたときにもビルドが実行されるように CI を構成します
trigger:
  branches:
    include:
    - main
  tags:
    include:
    - refs/tags/v*
  1. シークレット変数を使用して yarn deploy を呼び出す publish ステップを azure-pipelines.yml に追加します。
- bash: |
    echo ">>> Publish"
    yarn deploy
  displayName: Publish
  condition: and(succeeded(), startsWith(variables['Build.SourceBranch'], 'refs/tags/'), eq(variables['Agent.OS'], 'Linux'))
  env:
    VSCE_PAT: $(VSCE_PAT)

condition プロパティは、特定のケースでのみ公開ステップを実行するように CI に指示します。

この例では、条件には 3 つのチェックがあります

  • succeeded() - テストに合格した場合のみ公開します。
  • startsWith(variables['Build.SourceBranch'], 'refs/tags/') - タグ付き (リリース) ビルドの場合のみ公開します。
  • eq(variables['Agent.OS'], 'Linux') - ビルドが複数のエージェント (Windows、Linux など) で実行される場合に含めます。そうでない場合は、条件のその部分を削除します。

VSCE_PAT はシークレット変数であるため、環境変数としてすぐに使用できるわけではありません。したがって、環境変数 VSCE_PAT をシークレット変数に明示的にマッピングする必要があります。

GitHub Actions

GitHub Actions を構成して拡張機能 CI を実行することもできます。ヘッドレス Linux CI マシンでは VS Code を実行するために xvfb が必要であるため、Linux が現在の OS の場合は、Xvfb 対応環境でテストを実行します

on:
  push:
    branches:
      - main

jobs:
  build:
    strategy:
      matrix:
        os: [macos-latest, ubuntu-latest, windows-latest]
    runs-on: ${{ matrix.os }}
    steps:
    - name: Checkout
      uses: actions/checkout@v4
    - name: Install Node.js
      uses: actions/setup-node@v4
      with:
        node-version: 18.x
    - run: npm install
    - run: xvfb-run -a npm test
      if: runner.os == 'Linux'
    - run: npm test
      if: runner.os != 'Linux'

GitHub Actions の自動公開

  1. GitHub Actions シークレットの手順を使用して、VSCE_PAT を暗号化されたシークレットとして設定します。
  2. vscedevDependencies としてインストールします (npm install @vscode/vsce --save-dev または yarn add @vscode/vsce --dev)。
  3. PAT なしで package.jsondeploy スクリプトを宣言します。
"scripts": {
  "deploy": "vsce publish --yarn"
}
  1. タグが作成されたときにもビルドが実行されるように CI を構成します
on:
  push:
    branches:
    - main
  release:
    types:
    - created
  1. シークレット変数を使用して npm run deploy を呼び出す publish ジョブをパイプラインに追加します。
- name: Publish
  if: success() && startsWith(github.ref, 'refs/tags/') && matrix.os == 'ubuntu-latest'
  run: npm run deploy
  env:
    VSCE_PAT: ${{ secrets.VSCE_PAT }}

if プロパティは、特定のケースでのみ公開ステップを実行するように CI に指示します。

この例では、条件には 3 つのチェックがあります

  • success() - テストに合格した場合のみ公開します。
  • startsWith(github.ref, 'refs/tags/') - タグ付き (リリース) ビルドの場合のみ公開します。
  • matrix.os == 'ubuntu-latest' - ビルドが複数のエージェント (Windows、Linux など) で実行される場合に含めます。そうでない場合は、条件のその部分を削除します。

GitLab CI

GitLab CI は、ヘッドレス Docker コンテナで拡張機能をテストおよび公開するために使用できます。これは、事前構成済みの Docker イメージをプルするか、パイプライン中に Visual Studio Code を実行するために必要な xvfb とライブラリをインストールすることで実行できます。

image: node:12-buster

before_script:
  - npm install

test:
  script:
    - |
      apt update
      apt install -y libasound2 libgbm1 libgtk-3-0 libnss3 xvfb
      xvfb-run -a npm run test

GitLab CI の自動公開

  1. GitLab CI ドキュメントを使用して、VSCE_PAT をマスクされた変数として設定します。
  2. vscedevDependencies としてインストールします (npm install @vscode/vsce --save-dev または yarn add @vscode/vsce --dev)。
  3. PAT なしで package.jsondeploy スクリプトを宣言します。
"scripts": {
  "deploy": "vsce publish --yarn"
}
  1. タグでのみトリガーされるマスクされた変数を使用して npm run deploy を呼び出す deploy ジョブを追加します。
deploy:
  only:
    - tags
  script:
    - npm run deploy

よくある質問

継続的インテグレーションに Yarn を使用する必要がありますか?

上記の例はすべて、Yarn で構築された架空のプロジェクトを参照していますが、npmGruntGulp、またはその他の JavaScript ビルドツールを使用するように適応させることができます。