はじめに
nuxt3などを用いて開発したアプリケーションについて、github pages, netlify, aws amplify, およびServerless Framework+Lambdaなどを用いてデプロイすることが多いのですが、今回はvpsを用いて公開する機会があり、その備忘録です。
参考

Nuxt3をNetlifyおよびAWSにデプロイする方法の一例
Nuxt3をNetlifyおよびAWSにデプロイする方法の一例
具体的には、Amazon Lightsailとpm2を使用します。
Amazon Lightsailインスタンスの作成
Node.jsのblueprintを選択します。

また3000番ポートを使用するので、ファイアウォールを開放しておきます。

pm2の設定
以下の記事を参考にしました。

PM2を使ってNodeサーバを永続化する | いなばテクノ・エボリューション株式会社
はじめに 当社は以前の記事「Raspberry Pi でWebサーバを立てよう【Node.js】」でNodeサーバを使ったwebシステムを紹介しました。 実はこれには欠点があり、この方法で作ったwebサーバは予期しないエラーが発生したときに
インストール
sudo su
npm install pm2 -g
Nuxt3のダウンロードとビルド
サンプルプログラムをダウンロードします。
su bitnami
cd /home/bitnami/
git clone https://github.com/nakamura196/nuxt3-pm2
セットアップ
cd nuxt3-pm2
npm install
ビルド
npm run build
npm run preview
localhost:3000 でNuxt3のアプリケーションをご確認いただけます。
pm2を用いて起動する
cd /home/bitnami/
vi /home/bitnami/ecosystem.config.js
module.exports = {
apps: [{
name: 'demo',
cwd: '/home/bitnami/nuxt3-pm2',
exec_mode: 'cluster',
instances: 'max',
script: './.output/server/index.mjs',
watch: ['./'], // または true
watch_options: {
followSymlinks: true,
usePolling: true,
interval: 10000,
binaryInterval: 10000,
},
env: {
PORT: 3000,
NODE_ENV: 'production',
}
}]
}
以下のコマンドで、pm2が起動します。
pm2 start /home/bitnami/ecosystem.config.js

デーモン化
今度のTODOとして、以下の記事にもある通り、pm2をsystemctlの管理下に置くことなどが挙げられます。
https://zenn.dev/ukkz/articles/c19541f75754c7#さらにデーモン化する
別の機会に改めてチャレンジしたいと思います。
まとめ
vps(amazon lightsail)環境で、pm2を用いてnuxt3アプリケーションを公開することができました。サーバレスでない環境におけるnuxt3アプリケーションの公開の参考になりましたら幸いです。



コメント
…