Metadata version missmatch error

[sercandumansiz]

Metadata version mismatch for module d:/a/1/s/node_modules/ngx-device-detector/ngx-device-detector.d.ts, found version 4, expected 3

I am getting this error while building my app.

[dockleryxk]

This is an angular 4/5 problem. I think it is something to do with the peerDependencies here: https://github.com/KoderLabs/ngx-device-detector/blob/master/src/package.json

What version are you using of this package and Angular?

[zifeiyuSun]

I have the same error： { "name": "client", "version": "0.0.0", "license": "MIT", "scripts": { "client_serve": "ng serve --port 4201 --proxy-config proxy.conf.json --live-reload false", "dev": "ng serve -sm --port 4201 --proxy-config proxy.conf.json --prod --aot=false --live-reload false", "desktop": "ng serve --port 4201 --proxy-config proxy.conf.desktop.json --live-reload false", "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "^4.0.0", "@angular/common": "^4.0.0", "@angular/compiler": "^4.4.6", "@angular/core": "^4.4.6", "@angular/forms": "^4.0.0", "@angular/http": "^4.0.0", "@angular/platform-browser": "^4.0.0", "@angular/platform-browser-dynamic": "^4.0.0", "@angular/router": "^4.0.0", "@nguniversal/express-engine": "^5.0.0-beta.5", "bootstrap": "^3.3.7", "core-js": "^2.4.1", "ngx-device-detector": "^1.1.7", "rxjs": "^5.5.6", "screenfull": "^3.3.2", "socket.io-client": "^2.0.3", "zone.js": "^0.8.4" }, "devDependencies": { "@angular/cli": "^1.6.3", "@angular/compiler-cli": "^4.0.0", "@types/jasmine": "2.5.53", "@types/node": "~8.0.7", "codelyzer": "~3.1.2", "jasmine-core": "~2.6.4", "jasmine-spec-reporter": "~4.1.1", "karma": "~1.7.0", "karma-chrome-launcher": "~2.2.0", "karma-cli": "~1.0.1", "karma-coverage-istanbul-reporter": "^1.3.0", "karma-jasmine": "~1.1.0", "karma-jasmine-html-reporter": "^0.2.2", "protractor": "~5.1.0", "tslint": "~5.5.0", "typescript": "^2.3.4" } } # app package.json: { "_from": "ngx-device-detector@^1.1.3", "_id": "ngx-device-detector@1.1.7", "_inBundle": false, "_integrity": "sha512-xTZVj0y6NdMUmYARe2X1neIJ2Q+OcRBdo1bNcKtgwJVjai4j1W/VnsYFZHCDRWm6OsxjOSSNsvYEwlBFzNJhfw==", "_location": "/ngx-device-detector", "_phantomChildren": {}, "_requested": { "type": "range", "registry": true, "raw": "ngx-device-detector@^1.1.3", "name": "ngx-device-detector", "escapedName": "ngx-device-detector", "rawSpec": "^1.1.3", "saveSpec": null, "fetchSpec": "^1.1.3" }, "_requiredBy": [ "#USER", "/" ], "_resolved": "https://registry.npmjs.org/ngx-device-detector/-/ngx-device-detector-1.1.7.tgz", "_shasum": "c0ab447d44d66636bfa9052a0e964add65fa0c4e", "_spec": "ngx-device-detector@^1.1.3", "_where": "/Users/ata/work/joyserver/client", "author": { "name": "Ahsan Ayaz", "email": "ahsan.ubitian@gmail.com" }, "bugs": { "url": "https://github.com/KoderLabs/ngx-device-detector.git/issues" }, "bundleDependencies": false, "deprecated": false, "description": "<a href=\"https://koderlabs.github.io/ngx-device-detector\"> <h1 align=\"center\">ngx-device-detector</h1> </a>", "homepage": "https://github.com/KoderLabs/ngx-device-detector#readme", "jsnext:main": "ngx-device-detector.js", "keywords": [ "angular", "device", "device detector", "device detection", "angular2", "angular4" ], "license": "MIT", "main": "ngx-device-detector.umd.js", "module": "ngx-device-detector.js", "name": "ngx-device-detector", "peerDependencies": { "@angular/core": ">=4.0.0 || ^5.0.0", "rxjs": "^5.1.0", "zone.js": "^0.8.4", "@nguniversal/express-engine": "^5.0.0-beta.5" }, "repository": { "type": "git", "url": "git+https://github.com/KoderLabs/ngx-device-detector.git" }, "typings": "ngx-device-detector.d.ts", "version": "1.1.7" }

[AhsanAyaz]

@zifeiyuSun and @sercandumansiz This is an issue with incompatible angular versions as @dockleryxk mentioned.

You can see the possible solutions from here: https://github.com/angular/material2/issues/8229

But in general, you can either roll back to one of the previous releases that work for you. For instance, try v1.1.4. OR you can update the @angular/* packages to ^5.0.0

[dockleryxk]

@AhsanAyaz you could make the peer dependency on angular "^4.0.0 || ^5.0.0" instead of what you have now

[ramparvataneni]

We are having the same issue, unfortunately we cannot upgrade to Angular 5, we are currently using 4.3.2. I tried installing ngx-device-detector 1.1.7, 1.1.4, 1.1.0, all of them giving same mismatch error

[AhsanAyaz]

@dockleryxk I just tried that locally and it has no effect. Still getting the metadata mismatch error. Unfortunately, this is something that can't be fixed as far as I've researched. I've seen the only fix other libraries have proposed is upgrading to Angular 5.

Below is a quick way of doing that:

npm install @angular/animations@'^5.0.0' @angular/common@'^5.0.0' @angular/compiler@'^5.0.0' @angular/compiler-cli@'^5.0.0' @angular/core@'^5.0.0' @angular/forms@'^5.0.0' @angular/http@'^5.0.0' @angular/platform-browser@'^5.0.0' @angular/platform-browser-dynamic@'^5.0.0' @angular/platform-server@'^5.0.0' @angular/router@'^5.0.0' typescript@2.4.2 rxjs@'^5.5.2'

please let me know if that resolves it.

[dockleryxk]

@AhsanAyaz that is unfortunate. My proposed fix worked for ng-simple-slideshow. It must have something to do with the compilation/rollup.

[AhsanAyaz]

@dockleryxk would you have some time this weekend to look into it perhaps?

[dockleryxk]

Yes I don't mind at all. To be honest I think I got lucky with fixing mine. Before, I just used a version tag on my releases for Angular 4 which is an awful way to do it.

[g-guth]

Any news on that? Having the same problem here.

A tip. I have just changed the version tag on the ngx-device-detector.metadata.json file from 4 to 3, and its working now.

[AhsanAyaz]

@g-guth which version of ngx-device-detector you have? Do install the latest version.

[g-guth]

I´m using the latest version. 1.2.2 with angular 4.

[Arjanvdm]

I have the same problem.

Angular: ^4.4.1
ngx-device-detector: ^1.2.2

I tried other versions such as v1.1.4 but that resulted in a Can't resolve '@nguniversal/express-engine/tokens'

[mycroft16]

@g-guth Thank you for that! That worked for me as well.