Deploy Nuxt SSR to subdirectory on domain using pm2 and nginx

I have a domain that serves more than one application with different programming languanges. So when we access the application through the browser, the URL should be:

mydomain.org/app-name

I need help on how to deploy my NUXT SSR app on subdirectory.

This is my nginx configuration:

map $sent_http_content_type $expires {
  "text/html"                 epoch;
  "text/html; charset=utf-8"  epoch;
  default                     off;
}

server {
  #listen   80;
  listen 443 ssl http2;
  listen [::]:443 ssl http2;
  server_name  mydomain.org;

  if ($scheme = "http") {
       return 301 mydomain.org$request_uri;
  }
  # note that these lines are originally from the "location /" block
  root   /usr/share/nginx/html;
  index index.php index.html index.htm main.js server.js;

  charset utf-8;

  location /app-one/ {
    try_files $uri $uri/ /app-one/index.php?$args;
  }

  location /app-two/ {
    try_files $uri $uri/ /app-two/index.php?$args;
  }

  #here is my nuxt app
  location /nuxt-app/ {
       expires $expires;

       proxy_redirect  off;
       proxy_set_header Host $host;
       proxy_set_header X-Real-IP $remote_addr;
       proxy_set_header X-Forwarded-For    $proxy_add_x_forwarded_for;
       proxy_set_header X-Forwarded-Proto  $scheme;
       proxy_read_timeout          1m;
       proxy_connect_timeout       1m;
       proxy_pass http://publicIPAddress:3015/;
  }

Below is my nuxt.config.js:

const pkg = require("./package");

const VuetifyLoaderPlugin = require("vuetify-loader/lib/plugin");
import axios from "axios";

module.exports = {
  server: {
    port: 3015
  },
  router: {
    base: "/payroll-staging/",
   // prefetchLinks: true
  },
  /*
  ** Build configuration
  */
  build: {
    transpile: ["vuetify/lib"],
    plugins: [new VuetifyLoaderPlugin()],
    loaders: {
      stylus: {
        import: ["~assets/style/variables.styl"]
      }
    },
    extractCSS: true,
    optimization: {
       splitChunks: {
         cacheGroups: {
           styles: {
             name: 'styles',
             test: /\.(css|vue)$/,
             chunks: 'all',
             enforce: true
           }
         }
       }
    },
    /*
    ** You can extend webpack config here
    */
    extend(config, ctx) {}
  }
};

I also set this code inside package.json file:

"config": {
  "nuxt": {
    "host": "0.0.0.0",
    "port": "3015"
  }
}

I already tried using ecosystem.config.js file:

module.exports = {
  apps: [
    {
       name: 'app-name',
       exec_mode: 'cluster',
       instances: 'max', // Or a number of instances
       script: './node_modules/nuxt/bin/nuxt.js',
       args: 'start'
    }
  ]
}

After that I run:

% npm run build
% pm2 start

But the result when I tried to access the app URL, it always returns:

Cannot GET /

failed load

Can someone help me to fix this? Maybe there is another step that I missed?

How many English words
do you know?
Test your English vocabulary size, and measure
how many words do you know
Online Test
Powered by Examplum