Vue CLIでプロジェクト作成をしたらErrorになったので、その時の履歴です。
原因はnpmが古すぎて入れられないpackageがあったようです。
Vue CLIでプロジェクト作成
まずはvue/cliをインストール
$ npm install -g @vue/cli
プロジェクトを作成します。ここではchatという名前にしました。
$ vue create chat
オプションは以下を選択
❯ Default (Vue 3 Preview) ([Vue 3] babel, eslint)
❯ Use NPM
ほかは聞かれなかった気がする
(選ぶものによるのかな)
プロジェクトができたらディレクトリに移動して起動
$ cd chat
$ npm run serve
ここでエラーが出ました
ERROR Error: Cannot find module 'vue-loader-v16/package.json'
ログを確認
ログを確認すると、警告が出てました。
npmが古いらしい
WARN You are using an outdated version of NPM.
there may be unexpected errors during installation.
Please upgrade your NPM version.
バージョンを確認。
確かに古い…
$ npm -v
6.4.1
$ node -v
v10.15.3
Nodeのバージョンを変える
Nodeのバージョンを上げるとnpmのバージョンも上がるので、Nodeのバージョンをあげます。
私はnodenvを使っているので、nodenvでバージョンを変えます。
$ nodenv versions
system
* 10.15.3 (set by /Users/okada/.nodenv/version)
12.19.0
14.16.0
$ nodenv local 14.16.0
バージョンが変わったことを確認
$ nodenv versions
system
10.15.3
12.19.0
* 14.16.0 (set by /Users/okada/project/chat/.node-version)
$ node -v
v14.16.0
$ npm -v
6.14.11
生成された.node-version
はコミットしておきます。
(あとでどのバージョンで作ったかわかるように)
もう一度インストール
もう一度インストールしてから起動
$ npm i
$ npm run serve