Nuxt.js はとても簡単に始められます。シンプルなプロジェクトでは必要な依存パッケージは nuxt だけです。

create-nuxt-app を使用する

素早くスタートできるようにするため、Nuxt.js チームは足場ツール create-nuxt-app を作成しました。

npx がインストールされていることを確認してください。（npx は NPM 5.2.0 からデフォルトでバンドルされています）

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

もしくは yarn を使ってください:

$ yarn create nuxt-app <project-name>

いくつか質問されます:

1. サーバーサイドのフレームワークを選択します:
   • None (Nuxt default server)
   • Express
   • Koa
   • Hapi
   • Feathers
   • Micro
   • Adonis (WIP)
2. 好きな UI フレームワークを選択します:
   • None（後からでも追加できます）
   • Bootstrap
   • Vuetify
   • Bulma
   • Tailwind
   • Element UI
   • Ant Design Vue
   • Buefy
3. 好きなテスティングフレームワークを選択します:
   • None (後からでも追加できます）
   • Jest
   • AVA
4. Nuxt のモードを選択します。(Universal または SPA)
5. HTTP リクエストを簡単に行うために axios module を追加します。
6. 保存時にコードをチェックするために EsLint を追加します。
7. 保存時にコードを整形するために Prettier を追加します。

回答が終わり次第、全ての依存関係がインストールされ、プロジェクトを開始する次のステップへ進めます:

$ npm run dev

するとアプリケーションは http://localhost:3000 で動いています。

プロジェクトのディレクトリ構造についてより深く理解するには ディレクトリ構造のドキュメント を参照してください。

スクラッチから始める

Nuxt.js アプリケーションをスクラッチから作ることもとても簡単で、必要なものは 1つのファイルと 1つのディレクトリ だけです。まずはアプリケーションで動かす空のディレクトリを作りましょう:

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

package.json

nuxt の起動方法を指定する package.json ファイルが必要です:

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

上のように書いておけば npm run dev で Nuxt.js を起動できます。

nuxt のインストール

package.json を作成したら nuxt を npm でプロジェクトに追加しましょう:

$ npm install --save nuxt

pages ディレクトリ

Nuxt.js は pages ディレクトリ内の *.vue ファイルについて、各ファイルがアプリケーションのひとつのルートに対応するものとして変換します。

pages ディレクトリを作ります:

$ mkdir pages

それから最初のページを pages/index.vue に作ります:

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

そして、プロジェクトを起動します:

$ npm run dev

すると、アプリケーションは http://localhost:3000 で動いています。

プロジェクトのディレクトリ構造についてより深く理解するには ディレクトリ構造のドキュメント を参照してください。