Nuxt.jsのインストール方法

Node.jsをインストールする

Nuxt.jsをインストールする前にNode.jsのインストールが完了している必要があります。Node.jsのインストールには以下2つの方法があります。過去に書いた記事のリンクを貼りましたのでまだインストールをしていない場合はご参考にしてみてください。個人的には、②の方法がおすすめです。

1. 直接PCにNode.jsをインストールする方法（詳しくはコチラ）
2. Node.jsのバージョン管理システムを使ってインストールする方法（詳しくはコチラ）※こちらの記事はWindowsを使っている方用に書いてありますが、MacでもLinuxでもnvmは使うことができます

yarnをインストールする

Node.jsをインストールすると、npmというJavaScriptパッケージ管理マネージャーも一緒にインストールされます。npmがインストールされていれば、yarn（npmより新しいJavaScriptパッケージ管理マネージャー）をインストールしなくても大丈夫ですが、yarnの方が速度が早いということなので、ここではyarnをグローバルインストールしておきましょう。ターミナルを開いて下記コマンドを実行してyarnをインストールします。

これで、Nuxt.jsをインストールするための準備が整いました。

Nuxt.jsをインストールする

それでは、Nuxt.jsをインストールしていきましょう。ターミナルを開いて下記コマンドを実行します。下記コマンドを実行すると[application-name]で指定した名前のフォルダが、カレントディレクトリに作成されます。例えば、/home/hasaがカレントディレクトリの場合、yarn create nuxt-app nuxtjs-appとすると、/home/hasa/nuxtjs-appというディレクトリが作られるということです。cdコマンドでディレクトリを移動してから適当な場所にインストールしてください。

Nuxt.jsをセットアップするために質問に答える

次に、Nuxt.jsをセットアップするために色々と質問されますので回答していきます。下記は実際に僕が回答したものになります。質問ごとに1行分改行しています。一番上の文章が実際に表示される質問（英語）でその下が訳で3行目が僕が選択したものになります。構築するアプリケーションに適するものを選びましょう。

しばらく待つと下記のような画面が表示されます。Nuxt.jsのセットアップに成功しました。

Nuxt.jsアプリを起動する

せっかくなので、Nuxt.jsアプリを起動してみましょう。cdコマンドでnuxtjs-appディレクトリに移動します。

開発サーバを起動します。

ブラウザでhttp://localhost:3000/をリクエストすると開発サーバに接続できます。僕の場合はUIフレームワークにBuefyを選択したので、下記画面が表示されました。UIフレームワークの有無によって初期に表示される画面は異なります。

筆者

以上で、Nuxt.jsのインストールが完了しました。ここからアプリケーションを作っていくことになります。当ブログではNuxt.jsの記事をアップしていきますので、引き続きよろしくお願いいたします。