Nuxt.js is a framework for generating static websites using Vue.js. Today we’re we’re going to explore how to deploy your Nuxt.js application with [Laravel Forge](https://forge.laravel.com).

If you’re following along with your own Forge server, ensure that the server is a “App” or “Web” server so that Nginx is installed.

## Creating The Site

First, we’ll need a site to deploy our application. In this example, we’ll use `nuxt-app.laravel.com` as our domain name but you should assign the site a domain name that you control, or name the site `default` to access the site by the server’s IP address. As Nuxt.js doesn’t use PHP, we can also change the project type to “Static HTML”. Finally, we will also need to modify the “Web Directory” to `/dist`. The `dist` directory is where Nuxt.js generates the compiled version of our website that should be publicly available.

![image](https://laravel-blog-assets.s3.amazonaws.com/iB11j41NTBk23GAxaAiYL8iWGp4fAbQQCX1uSxAY.png “Creating our new site…”)

## Installing The Repository

With our site now configured, the next step is to install the repository that we want to deploy.

We’ll select “Git Repository” and then enter our repository details. As our project is not using PHP, we can disable the “Install Composer Dependencies” option.

## Configuring The Deploy Script

With static sites, you should avoid committing the generated site to your Git repository as it’ll very quickly grow in size. Instead, we’ll use our site’s deploy script to generate the site for us.

To do this, we can update our deploy script to do two additional tasks:

1. Install NPM dependencies. This will include the `nuxt` command that we need.
2. Generate the site.

We’ll update our deploy script like so:

“`bash
cd /home/forge/nuxt-app.laravel.com
git pull origin $FORGE_SITE_BRANCH

# Add These Two Lines…
npm ci
npm run generate

( flock -w 10 9 || exit 1
echo ‘Restarting FPM…’; sudo -S service $FORGE_PHP_FPM reload ) 9>/tmp/fpmlock
“`

## Deploy!

With these additional lines we can now deploy our application. Once the deployment has completed, we’ll now be able to access our site.

And there we have it, we’ve deployed our Nuxt.js site with Forge.

0 Shares:
You May Also Like