# プレビューログがリロードを繰り返す (Vue packages version mismatch error)

## 対象

* Vue.jsとVue.jsに依存するライブラリ（ `vue-template-compiler` 、`vue-loader` など）を使用し、`package.json` でバージョンを固定していないプロジェクト。

## 事象

下記のエラーにより、プレビューログがリロードを繰り返す事象が発生します。

```
[webpack-cli] Error:

Vue packages version mismatch:

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-template-compiler` 、`vue-loader` などのVue.js関連ライブラリのマイナーバージョンが更新された場合などに、プロジェクトで使用するVue.jsのバージョンと不整合が生じると、上記のエラーが起こります。

## 対応

* `package.json` を開き、`devDependencies` 及び `dependencies` に定義されているVue.js、関連ライブラリのバージョンから `^` を外してバージョンを固定します。

```
  "dependencies": {
    ・・・
    "vue": "^2.6.14",
    "vue-onsenui": "^2.6.4"
    ・・・
  },
  "devDependencies": {
     ・・・
    "vue-loader": "^15.9.8",
    "vue-template-compiler": "^2.6.14",
    ・・・
  }
```

↓

```
  "dependencies": {
    ・・・
    "vue": "2.6.14",
    "vue-onsenui": "2.6.4"
    ・・・
  },
  "devDependencies": {
     ・・・
    "vue-loader": "15.9.8",
    "vue-template-compiler": "2.6.14",
    ・・・
  }
```

* プレビューログより、プロジェクトの再構成を実行します。

![](https://3046938759-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MfWrOnV1iKerkfShm9O%2Fuploads%2FlvkSYWrzjxJN9iz1Q9KY%2Fimage.png?alt=media\&token=cbaf0f7c-e05f-4d36-83d4-ca35dfb4094e)

![](https://3046938759-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MfWrOnV1iKerkfShm9O%2Fuploads%2FaxYCnW3SURfd5R7Hu4Pr%2Fimage%20\(1\).png?alt=media\&token=5110525e-ae4b-4c67-b763-ebf8d253dfc8)