Как исправить ошибку несоответствия версии Vue-пакетов на Laravel Spark v4.0.9?

Когда я запускаю npm run dev в приложении Laravel Spark v4.0.9, я получаю следующую ошибку:

Module build failed: Error:

Vue packages version mismatch:

- [email protected]
- [email protected]

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

Мой package.json выглядит следующим образом:

{
  "private": true,
  "scripts": {
    "dev": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "cross-env NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "hot": "cross-env NODE_ENV=development node_modules/webpack-dev-server/bin/webpack-dev-server.js --inline --hot --config=node_modules/laravel-mix/setup/webpack.config.js",
    "production": "cross-env NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js"
  },
  "dependencies": {
    "axios": "^0.15.2",
    "bootstrap": "^3.0.0",
    "cross-env": "^3.2.3",
    "jquery": "^2.1.4",
    "js-cookie": "^2.1.0",
    "laravel-mix": "0.*",
    "moment": "^2.10.6",
    "promise": "^7.1.1",
    "sweetalert": "^1.1.3",
    "underscore": "^1.8.3",
    "urijs": "^1.17.0",
    "vue": "~2.0.1",
    "vue-resource": "^1.2.0",
    "vue-router": "^2.2.1",
    "vue-truncate-filter": "^1.1.6",
    "vuejs-datepicker": "^0.6.2"
  },
  "devDependencies": {
    "browser-sync": "^2.18.8",
    "browser-sync-webpack-plugin": "^1.1.4"
  }
}

Я пробовал следующее (в разное время, а не в порядке):

  • удаленные node_modules и npm install
  • попробовал только запустить yarn и yarn upgrade
  • удаление vue-loader и переустановка
  • указание точных версий vue и vue-template-compiler вместо того, чтобы оставить его до npm для установки или пряжи для определения зависимостей
  • удаление других несущественных пакетов (vue-router, vue-truncate-filter, vuejs-datepicker) и повторное выполнение всех вышеперечисленных
  • ударяя головой о стену

Ответы

Ответ 1

Это сработало для меня:

  • Изменить package.json:

    "vue": "^2.0.8",
"vue-template-compiler": "^2.1.8"

  • Удалить node_modules

  • Запустить npm install

Ответ 2

Для vue ^2.5.17.

В вашем package.json

Просто добавьте это в devDependencies или обновите версию vue-template-compiler:

  • "vue-template-compiler": "^2.5.17"

У вас будет такой вывод:

"devDependencies": {
  ...
  "lodash": "^4.17.4",
  "popper.js": "^1.14.4",
  "vue": "^2.5.17", // <= note the version
  "vue-template-compiler": "^2.5.17" // <= note the version
},

После этого запустите:

  • установка npm

Npm будет обновлять только обновленные пакеты.

Ответ 3

Выполнение следующей команды помогло мне

npm install [email protected] --save-dev

NB. Замените номер версии верной версией, которая вам нужна. В моем случае версия vue была 2.5.16, а vue-template-compiler была 2.5.13, поэтому я обновил vue-template-compiler до версии vue.

Надеюсь, это поможет кому-то

Исправление ошибки несоответствия версий пакетов Vue

Ответ 4

Не нужно удалять все папки node_modules. Просто обновите пакеты: vue, vue-template-compiler и vue-server-renderer с @latest флага @latest и это должно помочь в любых случаях с несовпадающими версиями пакетов vue.

npm я [email protected] --save

npm я [email protected] --save

--save автоматически обновит версию в вашем файле package.json. @latest означает установить последнюю доступную версию пакета. Если вам нужно обновить vue сделайте это так же, как мы делаем это в примере выше.

Также вы всегда можете проверить наличие новых версий на наличие обновлений с помощью команды: npm outdated. Он показывает вам весь список пакетов, которые должны быть обновлены.

Кстати, команда npm update обновляет только младшую версию и исправляет версии, но она не работает, когда вы хотите обновить основную версию. Например, npm update не обновит 2.4.5 => 3.0.1, но может обновить

Ответ 5

Здесь компилятор шаблона vue компилирует шаблон vue. Если вы используете vue one version и vue-template-compiler другую версию, это проблема.

Запустить эту команду

npm update vue-template-compiler

Это исправит проблему, и она установит компилятор шаблона vue, такой же, как версия vue js.

Ответ 6

Проверьте зависимость для vue и замените на точный уровень зависимости dev для vue-template-compiler.

Например,

"dependencies": {
    "vue": "^2.5.2",
},
"devDependencies": {
    "vue-template-compiler": "^2.5.3",
},

Должно быть заменено на:

"dependencies": {
    "vue": "2.5.2",
},
"devDependencies": {
    "vue-template-compiler": "2.5.2",
},

И снова запустите npm install.

Ответ 7

Попробуйте это: npm install [email protected] --save-dev

Преобразование версии vue-template-compiler в ту же версию vue (для этого случая 2.0.8) работало для меня. Попробуйте.

Ответ 8

Исходя из принятого ответа, вместо удаления папки node_modules и повторного запуска yarn yarn install, вы можете просто обновить эти 2 пакета напрямую:

yarn upgrade [email protected]^2.0.8
yarn upgrade [email protected]^2.1.8

Ответ 9

Это сработало для меня:

  • Изменить package.json: "vue": "^ 2.5.2" в "vue": "2.5. *"
  • Удалить папку node_modules
  • Удалить package-lock.json
  • Запустить npm install

Ответ 10

Вам не нужно удалять папку node_modules.

- [email protected] - [email protected]

Обновите пакет с более низким номером версии. В этом случае npm update vue. При желании вы также можете npm update vue-loader

Ответ 11

Я использовал npm install vue --save, и это сработало для меня