AWS DevDay 2018 AfterPartyの人気エディタ投票で1位になったVSCodeでCloudFormationを書くための個人的ベストな設定を紹介します。

AWSコンソールにもJSON, YAML両方に対応したエディタがありますが、チェック機能の安心感はあるもののエディタとしての使い勝手では、どうしても普段使うエディタに劣ります。

普段使いのVSCodeにCloudFormationをYAMLで書くための設定を導入しましょう。

導入するもの

code コマンドを使えば、一発です。

code --install-extension redhat.vscode-yaml

設定1

settings.json に以下の設定を追加します。
最近のVSCodeは設定画面をUIで出すようになったので、 ~~右上にある・・・ からsettings.jsonを開くか、~~
コマンドパレットを開いて >settings (JSON) と打ち込んでsettings.jsonを開きます。

settings.json

    "yaml.schemas": {
        "https://d33vqc0rt9ld30.cloudfront.net/latest/gzip/CloudFormationResourceSpecification.json": [
            "*.cf.yaml",
            "*.cf.yml",
            "cloud*formation/*.yaml",
            "cloud*formation/*.yml"
        ]
    },

https://d33vqc0rt9ld30.cloudfront.net/latest/gzip/CloudFormationResourceSpecification.json をYAMLスキーマとして登録しています。
これは、AWS CloudFormationリソース仕様のアジアパシフィック (東京)へのリンクです。
このリソース仕様をファイル名が *.cf.yml または cloud-formation ディレクトリ以下のyamlファイルの場合に適用するという風に設定しています。

この辺りはCloudFormationファイルにどういった名前をつけるかの好みによるので、適宜変更して下さい。

設定1だけの問題点

!Ref などのカスタムタグを書いた箇所がunknown tag <!Ref>エラーに！！！

YAMLサポート拡張がCloudFormationで使える!Refなどのカスタムタグに対応していないのが原因です。

設定2

カスタムタグをYAMLサポート拡張に教えます。
以下の設定をsettings.json に追加します。

settings.json

"yaml.customTags": [
    "!Ref",
    "!Sub scalar",
    "!Sub sequence",
    "!Join sequence",
    "!FindInMap sequence",
    "!GetAtt scalar",
    "!GetAtt sequence",
    "!Base64 mapping",
    "!GetAZs",
    "!Select scalar",
    "!Select sequence",
    "!Split sequence",
    "!ImportValue",
    "!Condition",
    "!Equals sequence",
    "!And",
    "!If",
    "!Not",
    "!Or"
  ],

結果

これでカスタムタグの問題に対応しつつ、YAMLサポートとAWS CloudFormationスキーマチェックをVSCodeで行える環境を手に入れました。

CloudFormationファイルの書き方自体は、下記の記事などが参考になります。

VSCodeでAWS CloudFormation をYAMLで書くための個人的ベスト設定

導入するもの

設定1

設定1だけの問題点

設定2

結果