Create and publish a Nuxt.js powered website on Github pages

How to build and share a static site from scratch in 5 minutes.

Install vue-cli:

npm install -g vue-cli

Create the project (replace my-project by your project name):

vue init nuxt/starter my-projectcd my-projectnpm install

Update nuxt.config.js to add a base URL (replace my-project by your project name):

router: { base: '/my-project/' },

Install push-dir:

npm install push-dir --save-dev

Create a deploy command to publish to Github pages by editing package.json file and adding this line at the beginning of the script section:

"deploy": "push-dir --dir=dist --branch=gh-pages --cleanup",

Connect to your Github account and create an empty repository.

Then commit and push your code to your repository (replace me by your name and my-project by your project name):

git initgit add .git commit -m "init"git remote add origin https://github.com/me/my-project.gitgit push -u origin master

Generate the site and publish it:

npm run generatenpm run deploy

Go to your site https://me.github.io/my-project (replace me by your name and my-project by your project name) and enjoy the result.

You can publish your changes by running this again:

npm run generatenpm run deploy

Voilà. 🤗