VS CodeでJSON Schemaを使ったらCircleCI Configの編集がすごく楽になった

2022.03.29

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

こんにちは、CX事業本部 IoT事業部の若槻です。

今回は、Visual Studio Code(VS Code)で、CircleCI Config.circleci/config.yml)に対してJSON Schemaによるバリデーション/アノテーションを効かせたら編集がすごく楽になったので、紹介をしたいと思います。

どう楽になったのか?

VS Codeで下記のようなCircleCI Configを開いています。

.circleci/config.yml

version: 2.1

executors:
  my-executor:
    docker:
      - image: circleci/node

orbs:
  aws-cli: circleci/aws-cli@2.1.0

jobs:
  get_token:
    executor: my-executor
    steps:
      - checkout
      - aws-cli/install

workflows:
  version: 2
  release:
    jobs:
      - get_token:
          context: aws-deploy

例えばversionプロパティに無効な値(0.5)が指定された場合、赤波線が入りConfigがバリデーションエラーとなります。

また赤波線にマウスオーバーするとホバーでアノテーションを確認できます。正しい値が2または2.1であることが分かります。

必須プロパティの指定がない場合もバリデーションエラーとなります。

アノテーションによりstepプロパティを指定する必要があることが分かります。

YAMLとして構文が不正な場合もバリデーションエラーとなります。

このようにCircleCI Configの編集時にバリデーションおよびアノテーションが効くようになり、編集がとても楽ちんになりました。この機能は、VS CodeでJSON Schemaを使用することにより実現することができます。

JSON Schemaの導入方法

下記のYAMLというExtensionをVS Codeにインストールするだけです。

提供はRed Hat社のようですね。

YAMLではJSON Schemaをサポートしており、導入すると対応しているドキュメントで自動的に利用可能となります。

使用しているドキュメントがJSON Schemaに対応している場合は、ファイル上部に下記のようなリンクが表示されます。クリックして開いてみます。

するとJSON Schemeのソース(CircleCIの場合はcircleciconfig.json)を開いて確認することができます。この定義ファイルに則ってファイル編集時にアノテーションやバリデーションが行われるようになります。

GitHub上のソースだと下記となります。

そもそもJSON Schemaは何かと言うと、JSON(YAML)ドキュメントのアノテーションやバリデーションの規格を行うオープンソースプロジェクトです。

JSON Schema is a vocabulary that allows you to annotate and validate JSON documents.

そしてJSON Schemaでは、今回確認したCircleCIの他にも様々なドキュメントに対する定義が頒布されています。

有名どころだとKubernetesやSwaggerなどがあります。(AWS CloudFormationもあるのかな?と探してみましたがこれはありませんでした。メンテが大変なのは分かる。 こちらにありました。)

おわりに

VS CodeでJSON Schemaを使ったらCircleCI Configの編集がすごく楽になったという話でした。

YAML自体は別の用途でインストールしていたので、CircleCI Configでもいつのまにかバリデーション/アノテーションが効くようになっていてびっくりました。型支援付きのプログラミングに慣れきってしまった現代のプログラマーには必須の機能だと思います。

以上