nuxt3をamazon lightsailで公開する:pm2の使用

2022/12/22に公開

はじめに

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

参考

https://zenn.dev/nakamura196/articles/9b87c12e5bd13d

具体的には、Amazon Lightsailとpm2を使用します。

Amazon Lightsailインスタンスの作成

Node.jsのblueprintを選択します。

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

pm2の設定

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

https://it-evo.jp/blog/blog-70/

インストール

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
/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アプリケーションの公開の参考になりましたら幸いです。

Discussion