高木のブログ

ブログを Vercel から Cloudflare Pages に移行した

2022/04/02

別件で takagi.blog ドメインを Cloudflare DNS で使いたかったので、どうせならとブログを Cloudflare Pages に移行してみた

手順

詳細な手順ではなく、大まかな流れだけ記録

Cloudflare Pages にデプロイ

Cloudflare Pages の「プロジェクトを作成」から GitHub のリポジトリを連携させるとサクッとデプロイできる

Node.js のバージョン指定

一部の使用しているライブラリが Node.js 12.20 以上が必要だった
Cloudflare Pages で使われる Node.js のデフォルトは 12.18.0 みたい

23:50:30.778  Installing NPM modules using Yarn version 1.22.4
23:50:31.335  yarn install v1.22.4
23:50:31.468  [1/4] Resolving packages...
23:50:32.029  [2/4] Fetching packages...
23:51:05.794  info [email protected]: The platform "linux" is incompatible with this module.
23:51:05.795  info "[email protected]" is an optional dependency and failed compatibility check. Excluding it from installation.
23:51:05.808  error [email protected]: The engine "node" is incompatible with this module. Expected version ">=12.20". Got "12.18.0"
23:51:05.818  error Found incompatible module.
23:51:05.818  info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.
23:51:05.853  Error during Yarn install
23:51:05.859  Failed: build command exited with code: 1

Node.js のバージョンは、環境変数 NODE_VERSION で指定できる
Vercel で14系を使っていたので、そのまま14系の最新バージョンを指定した 001.png

Cloudflare DNS に移行

メニューにDNSの文字が見当たらず、どこから登録するのかと思ったら、Webサイトとしてドメインを追加するみたい
元々使っていたDNSの設定がそのまま引き継がれた

アクティブになったら移行完了 002.png

独自ドメインの設定

Cloudflare Pages のカスタムドメインの設定から独自ドメインの設定ができる
あとは反映されるのを待つだけ

https://sitereport.netcraft.com/ で Vercel から Cloudflare Pages に切り替わったかどうか確認した

003.png

004.png

多分、ダウンタイムなしで移行できたと思う


ytkg

Written by ytkg, Twitter, GitHub