Vue: [v2.2.0-beta.1] vue and vue-template-compiler 2.1.10 version mismatch

Created on 24 Feb 2017 · 9Comments · Source: vuejs/vue

Vue.js version

2.2.0-beta.1

Reproduction Link

https://github.com/davidpicarra/vue-testing
This is a fresh webpack template from vue-cli with updated vue version to 2.2.0-beta.1

Steps to reproduce

Install dependencies
yarn

Run dev
yarn run dev

OR run build
yarn run build

What is Expected?

Dev command or build command should execute without errors.

What is actually happening?

Getting vue packages version mismatch for vue (2.2.0-beta.1) and vue-template-compiler (2.1.10)

→ yarn dev
yarn dev v0.20.0
$ node build/dev-server.js


 ERROR  Failed to compile with 1 errors                                                                                                                                                 10:53:49

 error  in ./src/App.vue

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 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.

    at Object.<anonymous> (/Users/davidpicarra/Projects/vue-testing/node_modules/vue-template-compiler/index.js:8:9)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/davidpicarra/Projects/vue-testing/node_modules/vue-loader/lib/parser.js:1:78)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)

 @ ./src/main.js 3:0-24
 @ multi ./build/dev-client ./src/main.js

> Listening at http://localhost:8080

→ yarn build
yarn build v0.20.0
$ node build/build.js
⠴ building for production...
Starting to optimize CSS...
Hash: ef638e40f3651c0c8be5
Version: webpack 2.2.1
Time: 4201ms
                                         Asset       Size  Chunks             Chunk Names
      static/js/vendor.7b827ddfbe53181b815f.js    76.6 kB    0, 2  [emitted]  vendor
         static/js/app.c4f1d1df771a1e0ced38.js     1.9 kB    1, 2  [emitted]  app
    static/js/manifest.f7b89fe11af3d43ff0ea.js     1.5 kB       2  [emitted]  manifest
  static/js/vendor.7b827ddfbe53181b815f.js.map     618 kB    0, 2  [emitted]  vendor
     static/js/app.c4f1d1df771a1e0ced38.js.map    3.76 kB    1, 2  [emitted]  app
static/js/manifest.f7b89fe11af3d43ff0ea.js.map    14.1 kB       2  [emitted]  manifest
                                    index.html  369 bytes          [emitted]

ERROR in ./src/App.vue
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 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.

    at Object.<anonymous> (/Users/davidpicarra/Projects/vue-testing/node_modules/vue-template-compiler/index.js:8:9)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/davidpicarra/Projects/vue-testing/node_modules/vue-loader/lib/parser.js:1:78)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
    at Module.require (module.js:498:17)
    at require (internal/module.js:20:19)
    at Object.<anonymous> (/Users/davidpicarra/Projects/vue-testing/node_modules/vue-loader/lib/loader.js:2:13)
    at Module._compile (module.js:571:32)
    at Object.Module._extensions..js (module.js:580:10)
    at Module.load (module.js:488:32)
    at tryModuleLoad (module.js:447:12)
    at Function.Module._load (module.js:439:3)
 @ ./src/main.js 3:0-24

  Build complete.

  Tip: built files are meant to be served over an HTTP server.
  Opening index.html over file:// won't work.

✨  Done in 6.66s.

Source

davidpicarra

Most helpful comment

oops... latest tag has been updated.

yyx990803 on 24 Feb 2017

👍2

All 9 comments

You forgot to bump vue-template-compiler version to 2.2.0-beta.1 :)

sqal on 24 Feb 2017

👍1

Doh! That wasn't auto updated when I ran npm update vue!
Cheers

davidpicarra on 24 Feb 2017

Mistakenly vue 2.2.0-beta.1 is published with latest tag and vue-template-compiler 2.2.0-beta.1 with beta.

Until this is fixed:
If you are trying latest beta then yarn add vue@latest vue-template-compiler@beta.
For stable version: yarn add vue@^2.1.10 vue-template-compiler

znck on 24 Feb 2017

That makes sense, I'll revert to stable version.

Btw I tried with latest beta but still I'm getting a different error when running build

→ yarn build
yarn build v0.20.0
$ node build/build.js
⠋ building for production...
Starting to optimize CSS...
Processing static/css/app.94a11c6e588f8770588f98833d1102b2.css...
Processed static/css/app.94a11c6e588f8770588f98833d1102b2.css, before: 431, after: 363, ratio: 84.22%
Hash: 72c3d893ba12b0ec16a1
Version: webpack 2.2.1
Time: 5617ms
                                                  Asset       Size  Chunks             Chunk Names
                  static/js/app.a76de79e0195f798a705.js    1.23 kB    0, 2  [emitted]  app
               static/js/vendor.bdbee5be558f247321d3.js    80.2 kB    1, 2  [emitted]  vendor
             static/js/manifest.b32f49bc14876a6229da.js     1.5 kB       2  [emitted]  manifest
    static/css/app.94a11c6e588f8770588f98833d1102b2.css  363 bytes    0, 2  [emitted]  app
              static/js/app.a76de79e0195f798a705.js.map    9.53 kB    0, 2  [emitted]  app
static/css/app.94a11c6e588f8770588f98833d1102b2.css.map  946 bytes    0, 2  [emitted]  app
           static/js/vendor.bdbee5be558f247321d3.js.map     645 kB    1, 2  [emitted]  vendor
         static/js/manifest.b32f49bc14876a6229da.js.map    14.1 kB       2  [emitted]  manifest
                                             index.html  448 bytes          [emitted]

ERROR in ./~/vue-loader/lib/template-compiler.js?{"id":"data-v-a95f1c1c"}!./~/vue-loader/lib/selector.js?type=template&index=0!./src/App.vue
Module build failed: TypeError: Cannot read property 'length' of undefined
    at Object.module.exports (/Users/davidpicarra/Projects/vue-testing/node_modules/vue-loader/lib/template-compiler.js:65:22)
 @ ./src/App.vue 9:2-164
 @ ./src/main.js

ERROR in ./~/vue-loader/lib/template-compiler.js?{"id":"data-v-30050d50"}!./~/vue-loader/lib/selector.js?type=template&index=0!./src/components/Hello.vue
Module build failed: TypeError: Cannot read property 'length' of undefined
    at Object.module.exports (/Users/davidpicarra/Projects/vue-testing/node_modules/vue-loader/lib/template-compiler.js:65:22)
 @ ./src/components/Hello.vue 9:2-172
 @ ./~/babel-loader/lib!./~/vue-loader/lib/selector.js?type=script&index=0!./src/App.vue
 @ ./src/App.vue
 @ ./src/main.js

  Build complete.

  Tip: built files are meant to be served over an HTTP server.
  Opening index.html over file:// won't work.

davidpicarra on 24 Feb 2017

😂 Beta could be buggy. Create an issue with minimal reproduction code.

znck on 24 Feb 2017

Guess this issue can be closed then, would be good to remove the latest tag from vue 2.2.0-beta.1 to avoid this confusion in the future.

davidpicarra on 24 Feb 2017

Keeping it open as a reminder to publish new version with latest tag.

/ping @yyx990803

znck on 24 Feb 2017

The beta has been accidentally published with the latest tag but it'll be fixed very soon 🙂
Sorry for the incovenience.
Basically there'll be a beta tag for both so you'll be able to do yarn install vue@beta vue-template-compiler@beta vue-loader@latest