スクリーンショット_2019-07-29_13

最速でNuxt.jsを構築する

一番簡単なNuxt.jsの構築方法です。

1. Nuxt.jsをインストールするディレクトリに移動

ターミナルを開き場所を移動します。

cd 好きな場所 


2. Nuxt.jsをインストール

下記コマンドにてNuxt.jsをインストールします。今回は「lm」という名前で作成します。

npx create-nuxt-app lm

すると、いくつか対話式で質問があります。特に気にしなければ全てEnterで問題ないです。

? Project name
? Project description
? Author name
? Choose the package manager
? Choose UI framework
? Choose custom server framework
? Choose Nuxt.js modules (Press <space> to select, <a> to toggle all, <i> to invert selection)
? Choose linting tools (Press <space> to select, <a> to toggle all, <i> to invert selection)
? Choose test framework
? Choose rendering mode


3. ディレクトリ移動

インストールしたNuxt.jsのディレクトリに移動します。

cd lm


4. Nuxt.js起動

下記コマンドにてNuxt起動します。

yarn dev

すると下記のように表示されますので

画像1


Nuxt.js v2.8.1 
Running in development mode (universal)

Listening on: http://localhost:3000/ 

ここでは『http://localhost:3000/』にアクセスします。

下記のような画面が表示されればOKです。

画像2

以上です。お疲れ様でした。


yarn dev でエラーが表示される場合

error Command failed with exit code 127.

上記のエラーが表示される場合は、再度 yarn installしてください。

yarn install

以上でエラー解消され、yarn devが実行されるようになります。

読んでいただきありがとうございます。