Installation

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

Using create-nuxt-app

To get started quickly, the Nuxt.js team has created scaffolding tool create-nuxt-app.
Make sure you have npx installed (npx is shipped by default since NPM 5.2.0)

$ npx create-nuxt-app <project-name>

Or with yarn:

yarn create nuxt-app <my-project>

It will ask you some questions:

1. Choose between integrated server-side frameworks:
   • None (Nuxt default server)
   • Express
   • Koa
   • Hapi
   • Feathers
   • Micro
   • Adonis (WIP)
2. Choose your favorite UI framework:
   • None (feel free to add one later)
   • Bootstrap
   • Vuetify
   • Bulma
   • Tailwind
   • Element UI
   • Buefy
3. The Nuxt mode you want (Universal or SPA)
4. Add axios module to make HTTP request easily into your application.
5. Add EsLint to Lint your code on save.
6. Add Prettier to prettify your code on save.

When answered, it will install all the dependencies so the next step is to launch the project with:

$ npm run dev

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

Nuxt.js will listen for file changes inside the pages directory, so there is 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>

and launch the project with:

$ npm run dev

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

Nuxt.js will listen for file changes inside the pages directory, so there is no need to restart the application when adding new pages.