Installation

Nuxt.js is really easy to get started with. A simple project only need the nuxt dependency.

Using Nuxt.js starter template

To start quickly, the Nuxt.js team has created a starter template.

Download the .zip starter template or install it with vue-cli:

$ vue init nuxt/starter <project-name>

If vue-cli is not installed, please install it with npm install -g vue-cli

then install the dependencies:

$ cd <project-name>
$ npm install

and launch the project with:

$ npm run dev

The application is now running on http://localhost:3000

Nuxt.js will listen on the files changes inside the pages directory, so no need to restart the application when adding new pages

To discover more about the directory structure of the project: Directory Structure Documentation.

Starting from scratch

Creating a Nuxt.js application from scratch is also really easy, it only needs 1 file and 1 directory. Let's create an empty directory to start working on the application:

$ mkdir <project-name>
$ cd <project-name>

Info: replace project-name by the name of the project.

The package.json

The project needs a package.json file to specify how to start nuxt:

{
  "name": "my-app",
  "scripts": {
    "dev": "nuxt"
  }
}

scripts will launch Nuxt.js via npm run dev.

Installing `nuxt`

Once the package.json has been created, add nuxt to the project via NPM:

npm install --save nuxt

The `pages` directory

Nuxt.js will transform every *.vue file inside the pages directory as a route for the application.

Create the pages directory:

$ mkdir pages

then create the first page in pages/index.vue:

<template>
  <h1>Hello world!</h1>
</template>