20
15

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 3 years have passed since last update.

Vue Packageのversionの違いによるエラーを解消する

Posted at

##背景

LaravelにVueを導入し、いざ

$npm run dev

のコマンドを実行したものの

Vue packages version mismatch:

- vue@2.6.10 (C:\xampp\htdocs\hoge\node_modules\vue\dist\vue.runtime.common.js)
- vue-template-compiler@2.6.11 (C:\xampp\htdocs\hoge\node_modules\vue-template-compiler\package.json)

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader@>=10.0, simply update vue-template-compiler.
If you are using vue-loader@<10.0 or vueify, re-installing vue-loader/vueify should bump vue-template-compiler to the latest.

このようなエラーが出て、実行ができなくなってしました。
エラーの原因が明確に表示され、解決方法も
vue-loader@>=10.0であればアップデートするだけだと
書かれているので簡単に解決できるのですが、vue-loaderやらvue-template-compiler
をなんだかあまり理解してないと
少しどうすればいいのかわからない部分もあったので記録として残しておきます。

##解決方法

上記にある

- vue@2.6.10
- vue-template-compiler@2.6.11

のバージョンの違いがあるとエラーになってしまうので
これを同じバージョンのする必要があります。

片方のバージョンを下げるのは更に手間がかかってしまうので
この場合だと、前者のほうをアップデートしました。
以下のコマンドでサクッと実行することができます。

$npm i vue

これで

$npm run dev

でのエラーを解決することができました。

npm関連のエラーに関しては以下の公式npmサイトを見れば非常に参考になるかと思います。

20
15
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
20
15

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?