Skip to content

Instantly share code, notes, and snippets.

@DreaMinder
Last active September 29, 2025 08:09
Show Gist options
  • Save DreaMinder/e9fc988295378d8373521a93c3ca6d18 to your computer and use it in GitHub Desktop.
Save DreaMinder/e9fc988295378d8373521a93c3ca6d18 to your computer and use it in GitHub Desktop.

Revisions

  1. DreaMinder revised this gist Jan 27, 2020. 1 changed file with 2 additions and 8 deletions.
    10 changes: 2 additions & 8 deletions A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -33,15 +33,9 @@ Fill server dir with your API code, in my case it's nodejs + koa2 + mongoose sta

    4.Upload nuxt.js bundle.
    ---
    If you use enviroment variables (I hope you are), open package.json file and change build script to
    `
    "build": "NODE_ENV=production nuxt build",
    `
    On production build, node.js will pass production flag to your nuxt.config.js. For example, you can make API URL different for dev and prod enviroments and more. Very usefull. (for Windows users, see cross-env package).
    Run `npm run build` on your local machine. I don't recommend to build nuxt.js on production server, because it eats lots of memory and causes up to minute of downtime. Take *package.json*, *nuxt.config.js* and *.nuxt* dir and copy them via SFTP (or pull from git) to client dir.

    Now it's time to make production build. Run `npm run build` on your local machine. I don't recommend to build nuxt.js on production server, because it eats lots of memory and causes up to minute of downtime. Take *package.json*, *nuxt.config.js* and *.nuxt* dir and copy them via sftp (or pull from git) to client dir.

    Note that there is special Nuxt package for running production renderer without useless overhead - `nuxt-start`. Intall it as dependency with same version as your Nuxt package. Move to your client directory on the server and install production dependencies (in most cases you only need nuxt-start package): `npm i -—production`.
    Note that there is a special Nuxt package for running production renderer without useless overhead - `nuxt-start`. Intall it as dependency with the same version as your Nuxt package. Move to your client directory on the server and install production dependencies (in most cases you only need nuxt-start package): `npm i -—production`.

    5.Set up PM2
    ---
  2. DreaMinder revised this gist Apr 3, 2019. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -1,7 +1,7 @@
    Example of deployment process which I use in my Nuxt.js projects.
    I usually have 3 components running per project: admin-panel SPA, nuxt.js renderer and JSON API.

    This manual is relevant for VPS such as DigitalOcean.com or Vultr.com. It's easier to use things like Now for deployment but for most cases VPS gives more flexebillity needed for projects bigger then a landing page.
    This manual is relevant for VPS such as DigitalOcean.com or Vultr.com. It's easier to use things like Now for deployment but for most cases VPS gives more flexebillity needed for projects bigger than a landing page.

    UPD: This manual now compatible with [email protected]. For older versions deployment, see revision history.

  3. DreaMinder revised this gist Dec 17, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -54,7 +54,7 @@ Install nginx:
    sudo apt-get update
    sudo apt-get install nginx

    (If you using root user, you have to set right permissions for project dirs to make it work with static files. Or just change `user: www-data` to `user: root` in /etc/nginx/nginx.conf.)
    (If you use root user, you have to set right permissions for project dirs to make it work with static files. Or just change `user: www-data` to `user: root` in /etc/nginx/nginx.conf.)
    Then edit config file /etc/nginx/sites-available/default, see config example below. Don't forget to `sudo nginx -s reload` after every nginx config modification.

    If you have already connected domain to your project, it's super easy to set up https (and http2). See this tutorial for installing [certbot](https://www.digitalocean.com/community/tutorials/how-to-secure-nginx-with-let-s-encrypt-on-ubuntu-16-04).
  4. DreaMinder revised this gist Nov 24, 2018. 2 changed files with 4 additions and 2 deletions.
    2 changes: 2 additions & 0 deletions A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -3,6 +3,8 @@ I usually have 3 components running per project: admin-panel SPA, nuxt.js render

    This manual is relevant for VPS such as DigitalOcean.com or Vultr.com. It's easier to use things like Now for deployment but for most cases VPS gives more flexebillity needed for projects bigger then a landing page.

    UPD: This manual now compatible with [email protected]. For older versions deployment, see revision history.

    ---
    Let's assume that you have entered fresh installation of Ubuntu instance via SSH. Let's rock:

    4 changes: 2 additions & 2 deletions config.yml
    Original file line number Diff line number Diff line change
    @@ -2,10 +2,10 @@
    ---
    apps:
    - name: client # process name. You will use it to make commands such as pm2 restart client
    script: node_modules/nuxt-start/bin/nuxt-start # path to nuxt-start renderer from root nuxt dir. Don't forget to install nuxt-start dependency
    script: node_modules/nuxt-start/bin/nuxt-start.js # path to nuxt-start renderer from root nuxt dir. Don't forget to install nuxt-start dependency
    cwd: /root/app/client # absolute path to nuxt dir
    max_memory_restart: "250M" # in case nuxt renderer eats all memory, it will be restarted
    args: "--max-old-space-size=200" # in case you running small amount of RAM
    args: "start" # command to skip build and start renderer
    env_production:
    PORT: 3000 # local port. Same port should be set in nginx config
    NODE_ENV: production # in case of enviroment variables usage
  5. DreaMinder revised this gist Nov 17, 2018. 2 changed files with 4 additions and 4 deletions.
    4 changes: 2 additions & 2 deletions A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -39,7 +39,7 @@ On production build, node.js will pass production flag to your nuxt.config.js. F

    Now it's time to make production build. Run `npm run build` on your local machine. I don't recommend to build nuxt.js on production server, because it eats lots of memory and causes up to minute of downtime. Take *package.json*, *nuxt.config.js* and *.nuxt* dir and copy them via sftp (or pull from git) to client dir.

    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt-start package): `npm i -—production`. Note that there is special Nuxt package for running production renderer without useless overhead - `nuxt-start`. Intall it as dependency with same version as your Nuxt package.
    Note that there is special Nuxt package for running production renderer without useless overhead - `nuxt-start`. Intall it as dependency with same version as your Nuxt package. Move to your client directory on the server and install production dependencies (in most cases you only need nuxt-start package): `npm i -—production`.

    5.Set up PM2
    ---
    @@ -59,7 +59,7 @@ If you have already connected domain to your project, it's super easy to set up

    7.Fire it up!
    ---
    Move to dir that contains your pm2 config file and run `pm2 start config.yml –-env production`. Yay, everything should work for now, but it doesn't. Run `pm2 logs` to see errors. This manual is complicated for a newbie and imperfect itself, so you will probably have to try several times. But it's worth it.
    Move to dir that contains your pm2 config file and run `pm2 start config.yml –-env production`. Yay, everything should work now, but it doesn't. Run `pm2 logs` to see errors. This manual is complicated for a newbie and imperfect itself, so you will probably have to try several times. But it's worth it.

    ---
    Contributions to this manual are appreciated.
    4 changes: 2 additions & 2 deletions default
    Original file line number Diff line number Diff line change
    @@ -37,7 +37,7 @@ server {
    expires max;
    }

    # serve static conten
    # serve static content
    location ~* \.(js|jpg|jpeg|txt|png|css|pdf|ico|map)$ {
    gzip_static on;
    expires 30d;
    @@ -50,7 +50,7 @@ server {
    # redirect for domain aliases
    server {
    server_name www.domain.com;
    return 301 $scheme://domain.com$request_uri;
    return 301 https://$host$request_uri;
    }

    # placeholder if user requests your servers' IP.
  6. DreaMinder revised this gist Nov 16, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -39,7 +39,7 @@ On production build, node.js will pass production flag to your nuxt.config.js. F

    Now it's time to make production build. Run `npm run build` on your local machine. I don't recommend to build nuxt.js on production server, because it eats lots of memory and causes up to minute of downtime. Take *package.json*, *nuxt.config.js* and *.nuxt* dir and copy them via sftp (or pull from git) to client dir.

    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt-start package): `npm i -—production`. Note that there is special nuxt package for running production renderer without useless overhead - nuxt-start. Intall it as dependency with same version of your nuxt package.
    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt-start package): `npm i -—production`. Note that there is special Nuxt package for running production renderer without useless overhead - `nuxt-start`. Intall it as dependency with same version as your Nuxt package.

    5.Set up PM2
    ---
  7. DreaMinder revised this gist Nov 16, 2018. 2 changed files with 2 additions and 2 deletions.
    2 changes: 1 addition & 1 deletion A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -39,7 +39,7 @@ On production build, node.js will pass production flag to your nuxt.config.js. F

    Now it's time to make production build. Run `npm run build` on your local machine. I don't recommend to build nuxt.js on production server, because it eats lots of memory and causes up to minute of downtime. Take *package.json*, *nuxt.config.js* and *.nuxt* dir and copy them via sftp (or pull from git) to client dir.

    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt-start package): `npm i -—production`.
    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt-start package): `npm i -—production`. Note that there is special nuxt package for running production renderer without useless overhead - nuxt-start. Intall it as dependency with same version of your nuxt package.

    5.Set up PM2
    ---
    2 changes: 1 addition & 1 deletion config.yml
    Original file line number Diff line number Diff line change
    @@ -2,7 +2,7 @@
    ---
    apps:
    - name: client # process name. You will use it to make commands such as pm2 restart client
    script: node_modules/nuxt/bin/nuxt-start # path to nuxt renderer from root nuxt dir. Don't touch it
    script: node_modules/nuxt-start/bin/nuxt-start # path to nuxt-start renderer from root nuxt dir. Don't forget to install nuxt-start dependency
    cwd: /root/app/client # absolute path to nuxt dir
    max_memory_restart: "250M" # in case nuxt renderer eats all memory, it will be restarted
    args: "--max-old-space-size=200" # in case you running small amount of RAM
  8. DreaMinder revised this gist Oct 11, 2018. 1 changed file with 8 additions and 5 deletions.
    13 changes: 8 additions & 5 deletions default
    Original file line number Diff line number Diff line change
    @@ -2,13 +2,16 @@ server {
    listen 80;
    listen 443 ssl http2;

    # set path to your project dir
    set $root_path /root/app;

    # your domain
    server_name domain.com;

    # static content directory
    root /root/app/public;
    root $root_path/public;

    # proxy to nuxt real time renderer.
    # proxy to nuxt renderer.
    location / {
    proxy_pass http://localhost:3000;
    }
    @@ -24,9 +27,9 @@ server {
    try_files /admin/index.html =404;
    }

    # serve nuxt bundle with max cache life. Only compatible with nuxt 2.*, for 1, remove 'client' from alias
    location ~*_nuxt(.*)$ {
    alias /root/app/client/.nuxt/dist/client/$1;
    # serve nuxt bundle with max cache life. Only compatible with nuxt 2.*. For 1.*, remove last 'client' from alias
    location ~^\/_nuxt(.*)$ {
    alias $root_path/client/.nuxt/dist/client/$1;
    gzip on;
    gzip_comp_level 6;
    gzip_vary on;
  9. DreaMinder revised this gist Oct 11, 2018. 3 changed files with 15 additions and 30 deletions.
    12 changes: 6 additions & 6 deletions A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,5 @@
    Example of deployment process which I use in my Nuxt.js projects.
    I usually have 3 components running per project: admin SPA, nuxt.js renderer and JSON API.
    I usually have 3 components running per project: admin-panel SPA, nuxt.js renderer and JSON API.

    This manual is relevant for VPS such as DigitalOcean.com or Vultr.com. It's easier to use things like Now for deployment but for most cases VPS gives more flexebillity needed for projects bigger then a landing page.

    @@ -8,7 +8,7 @@ Let's assume that you have entered fresh installation of Ubuntu instance via SSH

    1.Initial setup.
    ---
    Depending on size of project you have two choises: make non-root user or go on with root. I'd suggest you to go with root, which is easier (except nginx part). If you have chosen non-root, check out this [tutorial]( https://www.digitalocean.com/community/tutorials/initial-server-setup-with-ubuntu-16-04).
    Depending on size of project you have two options: make non-root user or go on with root. I'd suggest you to go with root, which is easier (except nginx part). If you have chosen non-root, check out this [tutorial]( https://www.digitalocean.com/community/tutorials/initial-server-setup-with-ubuntu-16-04).

    2.Install Node.js.
    ---
    @@ -39,11 +39,11 @@ On production build, node.js will pass production flag to your nuxt.config.js. F

    Now it's time to make production build. Run `npm run build` on your local machine. I don't recommend to build nuxt.js on production server, because it eats lots of memory and causes up to minute of downtime. Take *package.json*, *nuxt.config.js* and *.nuxt* dir and copy them via sftp (or pull from git) to client dir.

    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt package): `npm i -—production`.
    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt-start package): `npm i -—production`.

    5.Set up PM2
    ---
    PM2 is a process manager for node.js. I suggest it for newbies, but you can also try things like [Passenger](https://www.phusionpassenger.com/library/install/standalone/install/oss/xenial/). [Install PM2](https://github.com/Unitech/pm2) and create config file in your user root dir: *config.yml*. See config example below.
    PM2 is a process manager for node.js. [Install PM2](https://github.com/Unitech/pm2) and create config file in your user root dir: *config.yml*. See config example below. Don't forget to run `pm2 save && pm2 startup`, so your processes will recover on server restart.

    6.Set up Nginx
    ---
    @@ -52,8 +52,8 @@ Install nginx:
    sudo apt-get update
    sudo apt-get install nginx

    (If you using root user, you have to set right permissions for project dirs to make it work with static files. Or just change www-data to root in nginx.conf. Duno, it works for me.).
    Then edit config file /etc/nginx/sites-available/default, see config example below. Don't forget to `sudo nginx -s reload` after every nginx modification.
    (If you using root user, you have to set right permissions for project dirs to make it work with static files. Or just change `user: www-data` to `user: root` in /etc/nginx/nginx.conf.)
    Then edit config file /etc/nginx/sites-available/default, see config example below. Don't forget to `sudo nginx -s reload` after every nginx config modification.

    If you have already connected domain to your project, it's super easy to set up https (and http2). See this tutorial for installing [certbot](https://www.digitalocean.com/community/tutorials/how-to-secure-nginx-with-let-s-encrypt-on-ubuntu-16-04).

    4 changes: 2 additions & 2 deletions config.yml
    Original file line number Diff line number Diff line change
    @@ -4,13 +4,13 @@ apps:
    - name: client # process name. You will use it to make commands such as pm2 restart client
    script: node_modules/nuxt/bin/nuxt-start # path to nuxt renderer from root nuxt dir. Don't touch it
    cwd: /root/app/client # absolute path to nuxt dir
    max_memory_restart: "250M" # in case of nuxt renderer eats all memory, it will be restarted
    max_memory_restart: "250M" # in case nuxt renderer eats all memory, it will be restarted
    args: "--max-old-space-size=200" # in case you running small amount of RAM
    env_production:
    PORT: 3000 # local port. Same port should be set in nginx config
    NODE_ENV: production # in case of enviroment variables usage

    # API
    # API server, if you have one
    - name: server
    script: app.js
    cwd: /root/app/server
    29 changes: 7 additions & 22 deletions default
    Original file line number Diff line number Diff line change
    @@ -7,39 +7,24 @@ server {

    # static content directory
    root /root/app/public;

    # entry point for page renderer. Alias prop - absolute path to nuxt dir which contains prerendered nuxt pages.
    # If nginx found prerendered page, it reponses. If not - real time renderer responses.
    # You can programmaticaly generate pages to html files with your API and use them as cache.
    location / {
    alias /root/app/client/dist/$1;
    try_files $uri/index.html @renderer;
    }

    # proxy to nuxt real time renderer.
    location @renderer {
    location / {
    proxy_pass http://localhost:3000;
    error_page 502 = /200.html;
    }

    # If renderer crashes, nuxt runs in SPA mode.
    location = /200.html {
    alias /root/app/client/dist/$1;
    try_files /200.html =502;
    }

    # entry point for API server
    # entry point for API server, if you have one
    location /api {
    proxy_pass http://localhost:3001;
    client_max_body_size 3m;
    }

    # entry point for SPA admin page (if you have one).
    # entry point for SPA admin page, if you have one
    location /admin {
    try_files /app/index.html =404;
    try_files /admin/index.html =404;
    }

    # serve nuxt bundle with max cache life. This path is only compatible with nuxt 2.*
    # serve nuxt bundle with max cache life. Only compatible with nuxt 2.*, for 1, remove 'client' from alias
    location ~*_nuxt(.*)$ {
    alias /root/app/client/.nuxt/dist/client/$1;
    gzip on;
    @@ -49,8 +34,8 @@ server {
    expires max;
    }

    # serve static content
    location ~* \.(js|jpg|jpeg|txt|png|css|ico|map)$ {
    # serve static conten
    location ~* \.(js|jpg|jpeg|txt|png|css|pdf|ico|map)$ {
    gzip_static on;
    expires 30d;
    }
  10. DreaMinder revised this gist Oct 10, 2018. 2 changed files with 2 additions and 2 deletions.
    2 changes: 1 addition & 1 deletion A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -33,7 +33,7 @@ Fill server dir with your API code, in my case it's nodejs + koa2 + mongoose sta
    ---
    If you use enviroment variables (I hope you are), open package.json file and change build script to
    `
    "build": "NODE_ENV=production nuxt build -a",
    "build": "NODE_ENV=production nuxt build",
    `
    On production build, node.js will pass production flag to your nuxt.config.js. For example, you can make API URL different for dev and prod enviroments and more. Very usefull. (for Windows users, see cross-env package).

    2 changes: 1 addition & 1 deletion default
    Original file line number Diff line number Diff line change
    @@ -39,7 +39,7 @@ server {
    try_files /app/index.html =404;
    }

    # serve nuxt bundle with max cache life.
    # serve nuxt bundle with max cache life. This path is only compatible with nuxt 2.*
    location ~*_nuxt(.*)$ {
    alias /root/app/client/.nuxt/dist/client/$1;
    gzip on;
  11. DreaMinder revised this gist Oct 1, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion default
    Original file line number Diff line number Diff line change
    @@ -41,7 +41,7 @@ server {

    # serve nuxt bundle with max cache life.
    location ~*_nuxt(.*)$ {
    alias /root/app/client/.nuxt/dist/$1;
    alias /root/app/client/.nuxt/dist/client/$1;
    gzip on;
    gzip_comp_level 6;
    gzip_vary on;
  12. DreaMinder revised this gist Sep 2, 2018. 1 changed file with 2 additions and 3 deletions.
    5 changes: 2 additions & 3 deletions A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -14,9 +14,8 @@ Depending on size of project you have two choises: make non-root user or go on w
    ---
    Using [nvm](https://github.com/creationix/nvm) or directly:

    sudo apt-get install python-software-properties
    curl -sL https://deb.nodesource.com/setup_9.x | sudo -E bash -
    sudo apt-get install nodejs
    curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -
    sudo apt-get install -y nodejs

    3.Directory structure
    ---
  13. DreaMinder revised this gist Aug 23, 2018. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion config.yml
    Original file line number Diff line number Diff line change
    @@ -1,9 +1,10 @@
    (Don't forget to remove comments)
    ---
    apps:
    - name: client # process name. You will use it to make commands such as pm2 restart client
    script: node_modules/nuxt/bin/nuxt-start # path to nuxt renderer from root nuxt dir. Don't touch it
    cwd: /root/app/client # absolute path to nuxt dir
    max_memory_restart: 250M # in case of nuxt renderer eats all memory, it will be restarted
    max_memory_restart: "250M" # in case of nuxt renderer eats all memory, it will be restarted
    args: "--max-old-space-size=200" # in case you running small amount of RAM
    env_production:
    PORT: 3000 # local port. Same port should be set in nginx config
  14. DreaMinder revised this gist Apr 27, 2018. 1 changed file with 2 additions and 1 deletion.
    3 changes: 2 additions & 1 deletion default
    Original file line number Diff line number Diff line change
    @@ -1,5 +1,6 @@
    server {
    listen 80 443 ssl http2;
    listen 80;
    listen 443 ssl http2;

    # your domain
    server_name domain.com;
  15. DreaMinder revised this gist Apr 23, 2018. 1 changed file with 2 additions and 0 deletions.
    2 changes: 2 additions & 0 deletions config.yml
    Original file line number Diff line number Diff line change
    @@ -1,3 +1,5 @@
    ---
    apps:
    - name: client # process name. You will use it to make commands such as pm2 restart client
    script: node_modules/nuxt/bin/nuxt-start # path to nuxt renderer from root nuxt dir. Don't touch it
    cwd: /root/app/client # absolute path to nuxt dir
  16. DreaMinder revised this gist Apr 12, 2018. 1 changed file with 2 additions and 2 deletions.
    4 changes: 2 additions & 2 deletions config.yml
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,6 @@
    - name: client # process name. You will use it to make commands such as pm2 restart client
    script: node_modules/nuxt/bin/nuxt-start # path to nuxt renderer from root nuxt dir. Don't touch it
    cwd: "/root/app/client" # absolute path to nuxt dir
    cwd: /root/app/client # absolute path to nuxt dir
    max_memory_restart: 250M # in case of nuxt renderer eats all memory, it will be restarted
    args: "--max-old-space-size=200" # in case you running small amount of RAM
    env_production:
    @@ -10,7 +10,7 @@
    # API
    - name: server
    script: app.js
    cwd: "/root/app/server"
    cwd: /root/app/server
    env_production:
    PORT: 3001
    NODE_ENV: production
  17. DreaMinder revised this gist Apr 10, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -40,7 +40,7 @@ On production build, node.js will pass production flag to your nuxt.config.js. F

    Now it's time to make production build. Run `npm run build` on your local machine. I don't recommend to build nuxt.js on production server, because it eats lots of memory and causes up to minute of downtime. Take *package.json*, *nuxt.config.js* and *.nuxt* dir and copy them via sftp (or pull from git) to client dir.

    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt package): `npm i —production`.
    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt package): `npm i -—production`.

    5.Set up PM2
    ---
  18. DreaMinder revised this gist Apr 9, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -60,7 +60,7 @@ If you have already connected domain to your project, it's super easy to set up

    7.Fire it up!
    ---
    Move to dir that contains your pm2 config file and run `pm2 start config.yml –env production`. Yay, everything should work for now, but it doesn't. Run `pm2 logs` to see errors. This manual is complicated for a newbie and imperfect itself, so you will probably have to try several times. But it's worth it.
    Move to dir that contains your pm2 config file and run `pm2 start config.yml –-env production`. Yay, everything should work for now, but it doesn't. Run `pm2 logs` to see errors. This manual is complicated for a newbie and imperfect itself, so you will probably have to try several times. But it's worth it.

    ---
    Contributions to this manual are appreciated.
  19. DreaMinder revised this gist Apr 9, 2018. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -55,6 +55,7 @@ Install nginx:

    (If you using root user, you have to set right permissions for project dirs to make it work with static files. Or just change www-data to root in nginx.conf. Duno, it works for me.).
    Then edit config file /etc/nginx/sites-available/default, see config example below. Don't forget to `sudo nginx -s reload` after every nginx modification.

    If you have already connected domain to your project, it's super easy to set up https (and http2). See this tutorial for installing [certbot](https://www.digitalocean.com/community/tutorials/how-to-secure-nginx-with-let-s-encrypt-on-ubuntu-16-04).

    7.Fire it up!
  20. DreaMinder revised this gist Apr 9, 2018. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -22,6 +22,7 @@ Using [nvm](https://github.com/creationix/nvm) or directly:
    ---
    It's actually up to you, depending on type of your project, but I usually use this structure:
    - user dir (ex., /root)
    - - config.yml (pm2 config)
    - - app (project name)
    - - - client (nuxt.js files)
    - - - server (API server files)
  21. DreaMinder revised this gist Apr 9, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion default
    Original file line number Diff line number Diff line change
    @@ -23,7 +23,7 @@ server {

    # If renderer crashes, nuxt runs in SPA mode.
    location = /200.html {
    alias /root/acmd/client/dist/$1;
    alias /root/app/client/dist/$1;
    try_files /200.html =502;
    }

  22. DreaMinder revised this gist Apr 9, 2018. 1 changed file with 1 addition and 0 deletions.
    1 change: 1 addition & 0 deletions A Nuxt.js VPS production deployment.md
    Original file line number Diff line number Diff line change
    @@ -16,6 +16,7 @@ Using [nvm](https://github.com/creationix/nvm) or directly:

    sudo apt-get install python-software-properties
    curl -sL https://deb.nodesource.com/setup_9.x | sudo -E bash -
    sudo apt-get install nodejs

    3.Directory structure
    ---
  23. DreaMinder renamed this gist Apr 8, 2018. 1 changed file with 0 additions and 0 deletions.
  24. DreaMinder revised this gist Apr 8, 2018. 2 changed files with 0 additions and 0 deletions.
    File renamed without changes.
    File renamed without changes.
  25. DreaMinder renamed this gist Apr 8, 2018. 1 changed file with 0 additions and 0 deletions.
  26. DreaMinder revised this gist Apr 8, 2018. 2 changed files with 0 additions and 0 deletions.
    File renamed without changes.
    File renamed without changes.
  27. DreaMinder renamed this gist Apr 8, 2018. 1 changed file with 7 additions and 7 deletions.
    14 changes: 7 additions & 7 deletions z-default → nginx default
    Original file line number Diff line number Diff line change
    @@ -66,14 +66,14 @@ server {

    # placeholder if user requests your servers' IP.
    server {
    listen 80 default_server;
    listen [::]:80 default_server;
    listen 80 default_server;
    listen [::]:80 default_server;

    root /var/www/html;
    root /var/www/html;

    server_name _;
    server_name _;

    location / {
    try_files $uri =404;
    }
    location / {
    try_files $uri =404;
    }
    }
  28. DreaMinder revised this gist Apr 8, 2018. 1 changed file with 1 addition and 1 deletion.
    2 changes: 1 addition & 1 deletion Nuxt.js VPS production deploy.md
    Original file line number Diff line number Diff line change
    @@ -60,4 +60,4 @@ If you have already connected domain to your project, it's super easy to set up
    Move to dir that contains your pm2 config file and run `pm2 start config.yml –env production`. Yay, everything should work for now, but it doesn't. Run `pm2 logs` to see errors. This manual is complicated for a newbie and imperfect itself, so you will probably have to try several times. But it's worth it.

    ---
    Contributions to this manual appreciated.
    Contributions to this manual are appreciated.
  29. DreaMinder revised this gist Apr 8, 2018. 4 changed files with 33 additions and 30 deletions.
    17 changes: 10 additions & 7 deletions Nuxt.js VPS production deploy.md
    Original file line number Diff line number Diff line change
    @@ -8,7 +8,7 @@ Let's assume that you have entered fresh installation of Ubuntu instance via SSH

    1.Initial setup.
    ---
    Depending on size of project you have two choises: make non-root user or go on with root. I'd suggest you to go with root, which is easier (except nginx part). If you have chosen non-root, check out this [tutorial]( https://www.digitalocean.com/community/tutorials/initial-server-setup-with-ubuntu-16-04)
    Depending on size of project you have two choises: make non-root user or go on with root. I'd suggest you to go with root, which is easier (except nginx part). If you have chosen non-root, check out this [tutorial]( https://www.digitalocean.com/community/tutorials/initial-server-setup-with-ubuntu-16-04).

    2.Install Node.js.
    ---
    @@ -26,23 +26,23 @@ It's actually up to you, depending on type of your project, but I usually use th
    - - - server (API server files)
    - - - public (static content)

    Fill server dir with your API code, in my case it's koa2 + mongoose JSON API. Place at least favicon and robots.txt to public dir.
    Fill server dir with your API code, in my case it's nodejs + koa2 + mongoose stack. Place at least favicon and robots.txt to public dir.

    4.Upload nuxt.js bundle.
    ---
    If use enviroment variables (I hope you are), open package.json file and change build script to
    If you use enviroment variables (I hope you are), open package.json file and change build script to
    `
    "build": "NODE_ENV=production nuxt build -a",
    `
    On production build, node.js will pass production flag to your nuxt.config.js. For example, you can make API URL different for dev and prod enviroments and more. Very usefull. (for Windows users, see cross-env package).

    Now it's time to make production build. Run `npm run build` on your local machine. I don't recommend to build nuxt.js on production server, because it eats lots of memory and causes up to minute of downtime. Take *package.json*, *nuxt.config.js* and *.nuxt* dir and copy them via sftp (or pull from git) to client dir.

    Move to your client directory on the server and install production dependencies (in most cases only nuxt): `npm i —production`.
    Move to your client directory on the server and install production dependencies (in most cases you need only nuxt package): `npm i —production`.

    5.Set up PM2
    ---
    PM2 is a process manager for node.js. I suggerst it for newbies, but you also can try things like [Passenger](https://www.phusionpassenger.com/library/install/standalone/install/oss/xenial/). [Install PM2](https://github.com/Unitech/pm2) and create config file in your user root dir: *config.yml*. See config example below.
    PM2 is a process manager for node.js. I suggest it for newbies, but you can also try things like [Passenger](https://www.phusionpassenger.com/library/install/standalone/install/oss/xenial/). [Install PM2](https://github.com/Unitech/pm2) and create config file in your user root dir: *config.yml*. See config example below.

    6.Set up Nginx
    ---
    @@ -52,9 +52,12 @@ Install nginx:
    sudo apt-get install nginx

    (If you using root user, you have to set right permissions for project dirs to make it work with static files. Or just change www-data to root in nginx.conf. Duno, it works for me.).
    Then open config file /etc/nginx/sites-available/default in editor, see config example below. Don't forget to `sudo nginx -s reload` after every nginx modification.
    Then edit config file /etc/nginx/sites-available/default, see config example below. Don't forget to `sudo nginx -s reload` after every nginx modification.
    If you have already connected domain to your project, it's super easy to set up https (and http2). See this tutorial for installing [certbot](https://www.digitalocean.com/community/tutorials/how-to-secure-nginx-with-let-s-encrypt-on-ubuntu-16-04).

    7.Fire it up!
    ---
    Move to dir that contains your pm2 config file and run `pm2 start config.yml –env production`. Yay, everything should work for now, but it doesn't. Run `pm2 logs` to see errors. This manual is complicated for a newbie and inperfect itself, so you will probably have to try several times. But it's worth it.
    Move to dir that contains your pm2 config file and run `pm2 start config.yml –env production`. Yay, everything should work for now, but it doesn't. Run `pm2 logs` to see errors. This manual is complicated for a newbie and imperfect itself, so you will probably have to try several times. But it's worth it.

    ---
    Contributions to this manual appreciated.
    16 changes: 16 additions & 0 deletions pm2 config.yml
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,16 @@
    - name: client # process name. You will use it to make commands such as pm2 restart client
    script: node_modules/nuxt/bin/nuxt-start # path to nuxt renderer from root nuxt dir. Don't touch it
    cwd: "/root/app/client" # absolute path to nuxt dir
    max_memory_restart: 250M # in case of nuxt renderer eats all memory, it will be restarted
    args: "--max-old-space-size=200" # in case you running small amount of RAM
    env_production:
    PORT: 3000 # local port. Same port should be set in nginx config
    NODE_ENV: production # in case of enviroment variables usage

    # API
    - name: server
    script: app.js
    cwd: "/root/app/server"
    env_production:
    PORT: 3001
    NODE_ENV: production
    16 changes: 0 additions & 16 deletions pm2.config.yml
    Original file line number Diff line number Diff line change
    @@ -1,16 +0,0 @@
    - name: client #process name. You will use it to make commands such as pm2 restart client
    script: node_modules/nuxt/bin/nuxt-start #path to nuxt renderer from root nuxt dir. Don't touch it
    cwd: "/root/app/client" #absolute path to nuxt dir
    max_memory_restart: 250M # in case if nuxt renderer eats all memory, it will be restarted
    args: "--max-old-space-size=200" # in case you running small amount of RAM
    env_production:
    PORT: 3000 # local port. Same port should be set in nxginx config
    NODE_ENV: production # in case of enviroment variables usage

    # API
    - name: server
    script: app.js
    cwd: "/root/app/server"
    env_production:
    PORT: 3001
    NODE_ENV: production
    14 changes: 7 additions & 7 deletions z-default
    Original file line number Diff line number Diff line change
    @@ -1,6 +1,5 @@
    server {
    # ssl and http2 in case of lets encrypt use
    listen 80 443 ssl http2;
    listen 80 443 ssl http2;

    # your domain
    server_name domain.com;
    @@ -9,13 +8,14 @@ server {
    root /root/app/public;

    # entry point for page renderer. Alias prop - absolute path to nuxt dir which contains prerendered nuxt pages.
    # If nginx found prerendered page, it reponses with it. If not - real time renderer responses.
    # If nginx found prerendered page, it reponses. If not - real time renderer responses.
    # You can programmaticaly generate pages to html files with your API and use them as cache.
    location / {
    alias /root/app/client/dist/$1;
    try_files $uri/index.html @renderer;
    }

    # proxy to nuxt real time renderer.
    # proxy to nuxt real time renderer.
    location @renderer {
    proxy_pass http://localhost:3000;
    error_page 502 = /200.html;
    @@ -24,7 +24,7 @@ server {
    # If renderer crashes, nuxt runs in SPA mode.
    location = /200.html {
    alias /root/acmd/client/dist/$1;
    try_files /200.html =500;
    try_files /200.html =502;
    }

    # entry point for API server
    @@ -33,12 +33,12 @@ server {
    client_max_body_size 3m;
    }

    # entry point for SPA admin page (if you have one)
    # entry point for SPA admin page (if you have one).
    location /admin {
    try_files /app/index.html =404;
    }

    # serve nuxt bundle with max cache life. Modify alias prop - absolute path to .nuxt dir
    # serve nuxt bundle with max cache life.
    location ~*_nuxt(.*)$ {
    alias /root/app/client/.nuxt/dist/$1;
    gzip on;
  30. DreaMinder revised this gist Apr 6, 2018. 1 changed file with 0 additions and 4 deletions.
    4 changes: 0 additions & 4 deletions Nuxt.js VPS production deploy.md
    Original file line number Diff line number Diff line change
    @@ -14,10 +14,8 @@ Depending on size of project you have two choises: make non-root user or go on w
    ---
    Using [nvm](https://github.com/creationix/nvm) or directly:

    `
    sudo apt-get install python-software-properties
    curl -sL https://deb.nodesource.com/setup_9.x | sudo -E bash -
    `

    3.Directory structure
    ---
    @@ -50,10 +48,8 @@ PM2 is a process manager for node.js. I suggerst it for newbies, but you also ca
    ---
    Install nginx:

    `
    sudo apt-get update
    sudo apt-get install nginx
    `

    (If you using root user, you have to set right permissions for project dirs to make it work with static files. Or just change www-data to root in nginx.conf. Duno, it works for me.).
    Then open config file /etc/nginx/sites-available/default in editor, see config example below. Don't forget to `sudo nginx -s reload` after every nginx modification.