ngx-device-detector 1.3.3 not working in angular 7+ application

Viewed 17

I am trying to use ngx-device-detector v1.3.3 in my angular application. Really not sure what am i doing wrong.

I am getting below error:

Uncaught TypeError: Object(...) is not a function
    at ./node_modules/ngx-device-detector/fesm2015/ngx-device-detector.js (ngx-device-detector.js:750:49)
    at __webpack_require__ (bootstrap:83:1)
    at ./src/app/core/interceptors/case-management/interceptor.ts (sr-directives.module.ts:29:32)
    at __webpack_require__ (bootstrap:83:1)
    at ./src/app/app.module.ts (app.component.ts:19:26)
    at __webpack_require__ (bootstrap:83:1)
    at ./src/main.ts (main.ts:1:1)
    at __webpack_require__ (bootstrap:83:1)
    at 0 (main.ts:12:37)
    at __webpack_require__ (bootstrap:83:1)

My package.json

"dependencies": {
    "@angular-extensions/elements": "^7.4.0",
    "@angular/animations": "^7.2.9",
    "@angular/cdk": "^7.3.7",
    "@angular/common": "~7.2.0",
    "@angular/compiler": "~7.2.0",
    "@angular/core": "^7.2.9",
    "@angular/forms": "~7.2.0",
    "@angular/http": "^7.2.15",
    "@angular/material": "^7.3.4",
    "@angular/material-moment-adapter": "^8.1.2",
    "@angular/platform-browser": "~7.2.0",
    "@angular/platform-browser-dynamic": "~7.2.0",
    "@angular/router": "~7.2.0",
    "@fortawesome/angular-fontawesome": "^0.3.0",
    "@fortawesome/fontawesome-free-webfonts": "^1.0.9",
    "@fortawesome/fontawesome-svg-core": "^1.2.17",
    "@fortawesome/free-solid-svg-icons": "^5.8.1",
    "@ng-bootstrap/ng-bootstrap": "^3.3.0",
    "@ngx-translate/core": "^11.0.1",
    "@ngx-translate/http-loader": "^4.0.0",
    "@swimlane/ngx-charts": "^12.0.1",
    "@types/pdfjs-dist": "~2.1.7",
    "angular-hammer": "^2.2.0",
    "angular-material-fileupload": "^2.0.0",
    "angular-svg-round-progressbar": "^3.0.1",
    "angular-user-idle": "^2.2.1",
    "angular2-draggable": "^2.3.2",
    "angular2-text-mask": "^9.0.0",
    "bootstrap": "^4.3.1",
    "chart.js": "^2.9.3",
    "chartjs-plugin-datalabels": "^2.0.0",
    "core-js": "^2.5.4",
    "d3": "^4.13.0",
    "event-source-polyfill": "^1.0.22",
    "exceljs": "^4.1.1",
    "file-saver": "^2.0.2",
    "hammerjs": "^2.0.8",
    "howler": "^2.1.3",
    "https-proxy-agent": "^2.2.1",
    "jsencrypt": "^3.2.0",
    "material-design-icons": "^3.0.1",
    "moment": "^2.24.0",
    "ng-circle-progress": "^1.5.1",
    "ng-event-source": "^1.0.14",
    "ng-simple-slideshow": "^1.2.8",
    "ng2-charts": "~2.2.5",
    "ngx-bootstrap": "^5.6.2",
    "ngx-daterangepicker-material": "~2.1.8",
    "ngx-device-detector": "^1.3.3",
    "ngx-infinite-scroll": "^7.0.1",
    "ngx-pagination": "^4.1.0",
    "ngx-pipes": "^2.5.1",
    "ngx-quill": "^6.3.1",
    "ngx-show-hide-password": "^2.0.3",
    "ngx-ui-loader": "^7.2.1",
    "node-sass": "^4.14.1",
    "pdfjs": "^2.3.5",
    "pdfjs-dist": "~2.5.207",
    "quill": "^1.3.6",
    "quill-mention": "^3.1.0",
    "rxjs": "^6.5.4",
    "simple-pdf-viewer": "^2.0.3",
    "tslib": "^1.9.0",
    "xlsx": "^0.16.5",
    "zone.js": "~0.8.26"
  }

In prod build I get this error:

main.af4c7266efcd602edda6.js:1 Uncaught TypeError: Object(...) is not a function
    at main.af4c7266efcd602edda6.js:1:202752
    at Object.ARm4 (main.af4c7266efcd602edda6.js:1:202865)
    at f (runtime.c21f83f4a72b3dc8a0ac.js:1:507)
    at Module.zUnb (main.af4c7266efcd602edda6.js:1:2162237)
    at f (runtime.c21f83f4a72b3dc8a0ac.js:1:507)
    at 0 (main.af4c7266efcd602edda6.js:1:43617)
    at f (runtime.c21f83f4a72b3dc8a0ac.js:1:507)
    at t (runtime.c21f83f4a72b3dc8a0ac.js:1:376)
    at Array.r [as push] (runtime.c21f83f4a72b3dc8a0ac.js:1:248)
    at main.af4c7266efcd602edda6.js:1:47
0 Answers
Related