Cloudflare Pages がモノレポをサポートしました!
Cloudflare Pages はJAMStackホスティングのサービスです。Workersと連携しサーバサイドのJavaScriptを実行が可能であり、さらに様々なデータソースとの連携もサポートしておりフルスタックなホスティング基盤への進化しつつあります。
この記事では新たにサポートされたモノレポの設定手順をまとめます。
そのまえに・・
モノレポとポリレポ
従来 Pages のプロジェクトはGit レポジトリと1対1の関係を持っていました。Gitへの変更をリアルタイムに検知しDeployを実行させます。
これに対して一つのGitレポジトリを複数のProjectで連携させるのがモノレポです。対して一つのProjectで複数のGitレポジトリを持てるのがポリレポです。
Pagesは両方に対応していませんでしたが、新たにモノレポに対応するようになりました。
この図でいうとGitのecommerce-app
レポジトリへの繁栄はdesign-library
プロジェクトとpackage
プロジェクト双方のデプロイをトリガーしますが、marketing-app
レポジトリへの変更はdesign-library
プロジェクトへのデプロイのみをトリガーします。これによりレポジトリの共通化による重複作業を排除することが可能で、ソースコード管理を一括化させセキュリティの向上やレビュープロセスの簡素化、等のメリットが期待できます。
やってみる
まずとても単純な以下のGitレポジトリを準備しました。
projecta
とprojectb
とします。
過去のブログ執筆時点で少し画面の流れが変わっていますので以下にスクショを張っておきます。割と直感的に作業できるはずなので手順は割愛します。
この作業をprojecta
とprojectb
の2回分繰り返します。2つとも同じレポジトリをベースとします。
例えばprojectb
のデプロイ履歴はこうなっています。
以下のようにGitのindex.htmlを少し書き換えます。
a
とb
ともに変更を検知してDeployが行われます。
では次にGitレポジトリの/sub/index.html
を修正してみますがその前にprojecta
から/sub
フォルダを除外します。これによりprojectb
のみ/sub/index.html
の変更が反映されるようになります。
Settings
タブをクリックします。
Builds & deployments
をクリックします。
Build watch paths
のAdd paths
ボタンを押します。
このようにExclude
にsub/*
と設定するとprojecta
ではGitレポジトリのsub
フォルダへの変更はSkipされます。Save
をクリックします。
ではこの状態でGitレポジトリの/sub/index.html
を修正します。
projecta
は以下の通りskip
となっています。
projectb
は以下の通りデプロイが完了しています。
Discussion