目的：

担当する記事サイト改修でSSG/ヘッドレスCMSを導入する

問題：

・Vercelの利用を考えましたが、ドメイン変更が必要。
・SSG/ヘッドレスCMSを導入したいけど、ドメイン変更したくないというディレクターの要望。

検討

・とりあえず既存サーバー内にNodeサーバー構築し、いろいろ試すことに

nodenvとは

・nodeのバージョンを管理するためのコマンド
・プラグイン(nodenv-build)を入れることで、nodeのインストールが可能

nodenvのダウンロード

GitHubからnodenvのソースをcloneする

git clone https://github.com/nodenv/nodenv.git ~/.nodenv


nodenvのビルド

nodenvをビルドして実行可能な状態にする

cd ~/.nodenv && src/configure && make -C src


pathを通す

echo 'export PATH="$HOME/.nodenv/bin:$PATH"' >> ~/.bash_profile
echo 'eval "$(nodenv init -)"' >> ~/.bash_profile

pathを通してコマンドを叩けるようになる

シェルを再起動する

exec $SHELL -l

ログインシェルを再起動して新しい設定ファイルを読ませる

nodenvバージョンの確認

nodenv --version

プラグインのインストール

プラグイン用のディレクトリ作成

mkdir -p "$(nodenv root)"/plugins

プラグインのインストール（clone）

git clone https://github.com/nodenv/node-build.git "$(nodenv root)"/plugins/node-build

nodenvアップデート用プラグインのインストール（clone）

git clone https://github.com/nodenv/nodenv-update.git "$(nodenv root)"/plugins/nodenv-update

nodenv updateとコマンドを叩くことで、nodenvとそのプラグインを自動的にアップデート可能

nodeのインストール

インストール可能nodeバージョンの確認

nodenv install --list

nodeのインストール(14.15.1は現時点でのLTSバージョン)

nodenv install 14.15.1

rehash実行

nodenv rehash

・nodenvからnodeやグローバルなnpmパッケージを見えるようにするため
・新しいnodeのバージョンを入れたり、npm install -gなどを行ったときに実行する必要がある

nodeバージョンの確認

nodenv versions
* 14.15.1 (set by /home/ec2-user/***_deploy/blog/.node-version)

nodeバージョンの指定

プロジェクトで使うnodeのバージョンを指定
プロジェクトのディレクトリでのみ使うnodeのバージョンを指定する

cd /home/ec2-user/xxx_deploy/blog
nodenv local 14.15.1

プロジェクトのディレクトリ (/home/ec2-user/xxx_deploy/xxx_blog)内に.node-versionという名前の不可視ファイルが生成され、その中にそのディレクトリで使うnodeのバージョンが記述

ちなみにグローバルで使う場合のnodeバージョン指定

nodenv global 14.15.1

グローバルとローカル両方指定した場合、ローカルで指定した方が優先らしい。

build

npm ci(少し時間かかる)

npm run build

Compiled successfully、Export successfulメッセージでbuildが完了し、プロジェクトのディレクトリにout(デフォルト)というフォルダが出来て色々吐き出される。
outフォルダ内の記事のhtmlファイルを開くと問題なく記事が表示されたのでbuildが正常に行われたと判断。

その他nodeコマンド

nodeアンインストール

nodenv uninstall 14.15.1

nodenvのアップデート

nodenv update

nodenvのアンインストール

~/.nodenvのディレクトリを消すだけ

rm -rf $(nodenv root)


サーバーで直接コマンド実行でbuildが正常に行われたので次はGitHubActtionでpush時に自動でgitから最新ソースをpull後にnodeサーバーでbuildする仕組みを下記のように実装。
https://qiita.com/kerry/items/5568232516b8ee323d4b