Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Vue packages version mismatch error #470

Closed
jasonsanjose opened this issue Nov 16, 2016 · 15 comments
Closed

Vue packages version mismatch error #470

jasonsanjose opened this issue Nov 16, 2016 · 15 comments

Comments

@jasonsanjose
Copy link

Vue packages version mismatch:

- vue@2.0.5
- vue-template-compiler@2.0.6

This may cause things to work incorrectly. Make sure to use the same version for both.
If you are using vue-loader or vueify, re-installing them should bump vue-template-compiler to the latest.

In our project, we use exact dependencies:

    "vue": "2.0.5",
    "vue-loader": "9.7.0",

Since vue-loader uses caret ranges for vue-template-compiler...

"vue-template-compiler": "^2.0.5",

...when our Jenkins CI job runs npm install, the latest version of vue-template-compiler will get installed and will mismatch our vue version, causing random build failures whenever vue-template-compiler is upgraded.

A workaround suggested here vuejs/vue#3941 is to re-install vue-loader. We would rather work with exact versions of our dependencies and choose on our own when to upgrade.

To make matters more difficult, we can't use shrinkwrap in our repository due to npm/npm#2679.

Can vue or vue-loader address this case somehow?

@yyx990803
Copy link
Member

Have you considered using yarn with a lockfile?

@jasonsanjose
Copy link
Author

Not yet. Was hoping not to introduce a yet another tool to our build. :)

We can give that a shot and report back.

It would be nice if this worked with npm or if dependencies were organized in a way where this problem doesn't happen in the first place.

@yyx990803
Copy link
Member

yyx990803 commented Nov 16, 2016

Since your team seems to prefer a locked version approach, yarn would fit your workflow much better than npm, both for CI and for development - basically a better shrinkwrap. It's also in most cases a drop-in replacement for npm.

@ernestoalejo
Copy link

This should be fixed now in v10.0.0 according to the changelog.

Will that change reach vueify too or do I open a new issue there?

@mehrancodes
Copy link

I have the same problem when I'm using Yarn. But when trying npm, gulp compiles the vue components without any problem:

using yarn:

Vue packages version mismatch:

- vue@2.1.3
- vue-template-compiler@2.0.3

my dev dependencies are:

"devDependencies": {
  "gulp": "^3.9.1",
  "laravel-elixir": "^6.0.0-15",
  "laravel-elixir-vue-2": "^0.2.0",
  "laravel-elixir-webpack-official": "^1.0.9"

@mehrancodes
Copy link

Just cleaned the yarn cache and tried again, now it works well !

@terenceYu1997
Copy link

You need check your vue version in global. I removed the old vue version in global then npm install vue@2.2.4 -g,That solved my issue.

@Kristjan-Reinsberg
Copy link

same mismatch problem with new spark 4.09 install.

@developerewt
Copy link

Fixed for me:

npm install vue-template-compiler --save-dev

│ └─┬ vue-loader@9.9.5
│   └── vue-template-compiler@2.2.6  deduped
└─┬ vue-template-compiler@2.2.6 
  └──` he@1.1.1 

oligot pushed a commit to oligot/rollup-plugin-vue that referenced this issue Aug 25, 2017
`vue-template-compiler` is now a peer dependency instead of a direct dependency.
This allows the user to pin `vue-template-compiler` to a specific version instead of relying on the implicit upgrades from a semver caret range.

Without this change, updating Vue.js to version 2.4.2 can result in
errors like this:

Vue packages version mismatch:

- vue@2.4.2
- vue-template-compiler@2.4.1

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.

This was first reported in
[vue-loader](vuejs/vue-loader#470) and later
[fixed in version
10.0.0](https://gist.github.com/yyx990803/faebe22e8763f5b17572b35ed96f52fe#vue-loader1000).

There is also [an open issue on
vueify](vuejs/vueify#159) but it's not
currently fixed.
znck pushed a commit to vuejs/rollup-plugin-vue that referenced this issue Sep 26, 2017
* vue-template-compiler as a peer dependency

`vue-template-compiler` is now a peer dependency instead of a direct dependency.
This allows the user to pin `vue-template-compiler` to a specific version instead of relying on the implicit upgrades from a semver caret range.

Without this change, updating Vue.js to version 2.4.2 can result in
errors like this:

Vue packages version mismatch:

- vue@2.4.2
- vue-template-compiler@2.4.1

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.

This was first reported in
[vue-loader](vuejs/vue-loader#470) and later
[fixed in version
10.0.0](https://gist.github.com/yyx990803/faebe22e8763f5b17572b35ed96f52fe#vue-loader1000).

There is also [an open issue on
vueify](vuejs/vueify#159) but it's not
currently fixed.

* Install vue-template-compiler as a dev dependency

This is needed so that the tests work as expected

* Don't point to internal npm registry

* chore: remove unnecessary log statement

* fix: use any vue-template-compiler version which is >= 2.0

* chore: remove CHANGELOG.md; using release notes for change log.

[ci skip] [skip ci]
@arvidkahl
Copy link

I'll just leave this here if the above does not work.

With yarn, the yarn.lock file can be manually changed to fix this issue. Some library requires a rather old version, so I found that changing the section in yarn.lock actually resolves this issue:

vue-template-compiler@^2.0.0-alpha.8, vue-template-compiler@^2.5.16:
  version "2.5.16"
  resolved "https://registry.yarnpkg.com/vue-template-compiler/-/vue-template-compiler-2.5.16.tgz#93b48570e56c720cdf3f051cc15287c26fbd04cb"
  dependencies:
    de-indent "^1.0.2"
    he "^1.1.0"

Relevant part here is vue-template-compiler@^2.0.0-alpha.8, vue-template-compiler@^2.5.16: which you might need to adjust for whatever older version you want or have to override.

@saikathalderr
Copy link

i Use Vue cli ui tool to update everything.
it's update everything automatically and then i start project successfully.

@MarkSonn
Copy link

For me it was because my Vue version was behind my vue-template-compiler by 4 patches (vue@2.6.6 vs vue-template-compiler@2.6.10). I just updated vue both globally and locally and everything worked.

So with Yarn as my package manager:

yarn global add vue
yarn add vue

@MarkSonn
Copy link

I'm so glad that I posted my above comment becuase I ran into the same issue and forgot how to solve it. This time, however, my vue-template-compiler was behind.

Get them both up-to-date globally with:

yarn global add vue
yarn global add vue-template-compiler

@mizradev
Copy link

Fixed for me:

npm install vue-template-compiler --save-dev

│ └─┬ vue-loader@9.9.5
│   └── vue-template-compiler@2.2.6  deduped
└─┬ vue-template-compiler@2.2.6 
  └──` he@1.1.1 

This was what I needed... Very thanks!

@SamuelSoaresSilva
Copy link

  • vue@2.6.12
  • vue-template-compiler@2.7.16
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.

Fixed for me:

npm i vue@2.7.16 --save-dev

I just needed to keep the version of Vue compatible with the compiler

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests