[ 目次 ]

• はじめに
• vueコマンドを利用してNuxt.jsプロジェクト作成する
• サーバー起動
• 修正（2018/10/24）

はじめに

こんにちは、香港に住んでいるWEBデベロッパーのなかむ（@nakanakamu0828）です。

この記事は過去に運用していたブログからの移行記事になります。

今回は、Vuetify を利用して、Nuxt.jsのプロジェクトを作成していきます。

vueコマンドを利用してNuxt.jsプロジェクト作成する

Vuetifyは、用途ごとにテンプレートを用意してくれています。今回はNuxt.jsのテンプレートを利用します。

以下のコマンドからプロジェクトを作成します

$ vue init vuetifyjs/nuxt my-vuetify

? Project name my-vuetify
? Project description Nuxt.js + Vuetify.js project
? Author
? Use a-la-carte components? Yes

   vue-cli · Generated "my-vuetify".

   To get started:

     cd my-vuetify
     npm install # Or yarn
     npm run dev

$ cd my-vuetify
$ npm install

サーバー起動

開発環境としてサーバーを起動してみましょう。

$ npm run dev

ブラウザから http://localhost:3000 を開いて確認しましょう。
以下の画面が表示されればVuetifyテンプレートからのNuxt.jsプロジェクト作成成功です。

今回の成果物は こちら になります。
Netlifyでデモ環境を用意しています。以下のURLにてご確認ください。

https://elated-booth-6c04fe.netlify.com/

修正（2018/10/24）

デモページに関しては、サンプルで作ったものなので閉鎖しました。