Introduction

PM2 stands for process manager 2 and has a lot neat features which includes automatic application load balancing, declarative application configuration, deployment system and monitoring.

In this blog I will show you how to deploy your nuxt app to your server using pm2.

Prerequisites

• A server with ssh access
• Node.js installed on server
• PM2 installed on server
• PM2 installed locally
• The project needs to be managed using GIT and pushed to a GIT server
• A folder on your server where your nuxt app will live

Your nuxt app will need to set the nuxt.config.js target as server as this can only be done if the app runs in SSR mode.

I am using an Ubuntu server with a non-root user with sudo privileges.

A server with ssh access

Make sure you are able to ssh into the server before going any further. Please make note of the user and IP of the machine, you will need them for the pm2 config.

PM2 installed on the server

You will need to install Node.js on your server before you can actually install any package let alone PM2.

Let's start by ssh into your server and update apt.

$ sudo apt update

Install Node.js from the repositories

$ sudo apt install nodejs

Now let's install the npm package manager

$ sudo apt install npm

Now we have npm installed we can now install pm2. Let's install that globally.

$ npm install -g pm2

Now let's run this command to verify that we have pm2 installed.

$ pm2 --version

4.4.0

And while we're here let's install yarn as well.

$ npm install -g yarn

Install PM2 locally

Since you have a nuxt app on your local machine, I'm assuming we have everything we need already. We just need to install pm2 globally on your local machine.

$ npm install -g pm2

PM2 configuration

Now we pm2 installed on the server and pm2 installed locally, we can now move on to creating the config file and running the setup command.

In the root of your nuxt app, let's create a file called ecosystem.config.js with the following config.

module.exports = {
  apps : [
    {
      name: 'nuxtjs',
      script: './node_modules/nuxt/bin/nuxt.js',
      args: 'start'
    }
  ],
  deploy : {
    // "production" is the environment name
    production : {
      user: 'web',
      host: ['machine ip address'],
      ref: 'origin/master',
      repo: 'git@git-repo.git',
      ssh_options: ['ForwardAgent=yes'],
      path: '/var/www/warrenlee.tech',
      'post-deploy' : 'yarn && yarn build && pm2 startOrRestart ecosystem.config.js --env production'
    }
  }
}

apps

name: This will be the name of the process referred to in pm2
script and args: This is essentially how we fire up nuxt using yarn start after we've built our app

deploy

• production: we could also have a development key and/or a staging key but this is entirely up to you if you have other environments to deploy to.
• user: Remember I asked you to make a note of the user you use to ssh into the server? We'll need the name here.
• host: And also the IP address of the machine. If you have multiple machines, you can also set them here in an array.
• ref: The remote name and branch where your project will be pulled from.
• repo: The git repo address.
• ssh_options: Normally you would have to add the server ssh key to the GIT server so that it can be authorized to pull the code, but here I will be using ssh-forwarding which will allow authorization using my own ssh key.
• path: The folder on the server where the code will be pulled to.
• post-deploy: A series of commands after the code has been pulled into the server. Here we install the packages using yarn, then we build the nuxt app using yarn build and then we tell pm2 to start or restart the process to start the nuxt from the config under apps in the config file.

That was the explanation of the config, now let's set up the deployment.

From your local machine run this command at the root of your nuxt project.

$ pm2 deploy production setup

This will set up the necessary folders in your server and will start deploying your code. You will need to make sure that your user is able to create folders.

And with this, you should have your nuxt app on your server running under http://localhost:3000. Now to actually get this running on the web we'll need to setup nginx using reverse proxy.

To deploy thereafter you only need to run the following on your local machine.

$ pm2 deploy ecosystem.config.js production

But I recommend adding this to your package.json as a script

"scripts": {
    "deploy": "pm2 deploy ecosystem.config.js production",
}

With this, I would run yarn deploy to deploy my app to my server but you must make sure that your is pushed to GIT before deploying, otherwise pm2 will warn you that your code is not committed or not yet pushed.

Notes

It's normal not to be able to get this to run the first time as you might occur errors such as the user does not have the privilege to create folders or is not authorized to pull from GIT. If you get the GIT issue you can try using the ssh forwarding command to see if that helps.

$ ssh-add -K

If you need more explanations or want to find out more options for the config, please checkout pm2's documentation on it https://pm2.keymetrics.io/docs/usage/deployment/

In my next blog, I will explain how to use Nginx to run your Nuxt app.