IT大生、洋楽和訳とプログラミング

これからのIT時代を生き抜くブログ。

Nuxt.js を使いこなしたい!

この記事ではNuxt.js を1から始める筆者とともにどのようにして使いこなしていくかを学べるよう考慮したものになってます。

何から始める?

まずはこの記事から始めようと思いました!早速記事を見ながらNuxt.js のための環境構築から始めていきます。

必要なもののインストール

vue-cliがインストールされていない場合は、以下のコマンドを実行してvue-cliをインストールしてください。

ということで以下のコマンドを実行します。
npm install -g vue-cli
すでにインストールされている場合は必要ありません。

次に,以下のコマンドでNuxt のテンプレートプロジェクトを生成します。

vue init nuxt-community/starter-template sample

ところが,私の場合以下の表示がされました

$ vue init nuxt-community/starter-template sample

  Command vue init requires a global addon to be installed.
  Please run npm i -g @vue/cli-init and try again.

ということで,以下のコマンドを実行

npm i -g @vue/cli-init

これで初期化ができるようになりました。以下のコマンドを入力して必要なものをインストールします。

cd sample

npm install

次に,以下のコマンドで開発用のサーバーを起動します。 npm run dev

そうすると,http://localhost:3000/で画面を開くことができるようになります!