Vue.jsの環境構築

はじめに

久しぶりにVueを触ったので、作業記録として環境構築を記載します。

CLIインストール

CLIのインストールから実施します。

npm install -g @vue/cli

で、Vue CLIのインストールを実行します。

エラーが出た場合には、sudoコマンドをつけて実行してみてください。

プロジェクトの作成

本流

vue create my-vue-app

を実行すると、Please pick a preset: Default hoghoge..というのが表示されます。

好きなものを選んでください。

cd my-vue-app

で作成したプロジェクトに移動します。

npm run server

を実行すると、Vue.jsの開発サーバーが起動し、ブラウザでアプリケーションを見ることができます。

エラー対応

Vue.jsのプロジェクトを作成する時に、エラーが発生したのでログを残しておきます。

vue create my-vue-app

を叩いた時に、

Error: command failed: npm install --loglevel error --legacy-peer-deps

このようなエラーが出ました。

この場合、キャッシュを削除すると、解消ができるかもしれません。

キャッシュを削除するためのコードは下記です。試してみてください。

npm cache clean --force

終わりに

ささっとプロジェクトを作成するまでを記載しました。

何からやれば良いかわからない方は参考にしてみて下さい。