Not able to run angular app due to ɵɵinject & ɵɵdefineInjectable (Getting error at compile time)

Question

Get this error after npm install:

+-- UNMET PEER DEPENDENCY @angular/common@6.1.10

+-- UNMET PEER DEPENDENCY @angular/core@6.1.10

`-- file-saver@1.3.8

Get this error after compile:

WARNING in ./node_modules/@agm/core/fesm5/agm-core.js 4538:120-128 "export 'ɵɵinject' was not found in '@angular/core'

WARNING in ./node_modules/@agm/core/fesm5/agm-core.js 4538:34-52 "export 'ɵɵdefineInjectable' was not found in '@angular/core'

my package.json is:

{
  "name": "web-app",
  "version": "2.1.0",
  "license": "MIT",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "public": "ng serve --port 8080 --host 0.0.0.0",
    "build": "ng build --prod --build-optimizer",
    "lint": "tslint \"src/**/*.ts\"",
    "test": "ng test",
    "pree2e": "webdriver-manager update --standalone false --gecko false",
    "e2e": "protractor"
  },
  "private": true,
  "dependencies": {
    "@agm/core": "^1.0.0-beta.2",
    "@angular/animations": "^6.1.10",
    "@angular/cdk": "^6.4.7",
    "@angular/common": "^6.1.10",
    "@angular/compiler": "^6.1.0",
    "@angular/core": "^6.1.10",
    "@angular/forms": "^6.1.0",
    "@angular/http": "^6.1.0",
    "@angular/material": "^6.4.7",
    "@angular/material-moment-adapter": "^6.4.2",
    "@angular/platform-browser": "^6.1.0",
    "@angular/platform-browser-dynamic": "^6.1.0",
    "@angular/router": "^6.1.0",
    "@turf/turf": "latest",
    "@types/file-saver": "^1.3.0",
    "core-js": "^2.5.7",
    "cron": "^1.7.2",
    "enhanced-resolve": "^3.3.0",
    "file-saver": "^1.3.8",
    "hammerjs": "^2.0.8",
    "highcharts": "^6.1.1",
    "lodash": "^4.17.10",
    "moment": "^2.22.2",
    "ngx-clipboard": "^11.1.1",
    "ngx-gauge": "1.0.0-beta.7",
    "progressbar.js": "^1.0.1",
    "rxjs": "6.2.2",
    "rxjs-compat": "6.2.2",
    "screenfull": "^3.3.2",
    "socket.io": "^2.1.1",
    "socket.io-client": "^2.1.1",
    "ts-helpers": "^1.1.2",
    "zone.js": "^0.8.26"
  },
  "devDependencies": {
    "@angular/cli": "^1.6.6",
    "@angular/compiler-cli": "^6.1.0",
    "@types/googlemaps": "^3.30.16",
    "@types/highcharts": "^5.0.25",
    "@types/jasmine": "2.8.8",
    "@types/node": "~8.0.0",
    "@types/socket.io": "^1.4.36",
    "@types/socket.io-client": "^1.4.32",
    "codelyzer": "^4.4.2",
    "jasmine-core": "2.5.2",
    "jasmine-spec-reporter": "2.5.0",
    "karma": "2.0.5",
    "karma-chrome-launcher": "^2.2.0",
    "karma-cli": "^1.0.1",
    "karma-jasmine": "^1.1.2",
    "karma-remap-istanbul": "^0.6.0",
    "protractor": "~4.0.13",
    "ts-node": "1.2.1",
    "tslint": "^5.10.0",
    "typescript": "2.7.2"
  },
  "browserslist": [
    "last 2 versions",
    "ie 11"
  ]
}

Answer 1

finally all I had to do was

npm i @agm/core@1.0.0

then my OLD project worked fine

Answer 2

I solved this issue by opening node_modules/ and removing all occurrences of ɵɵinject and ɵɵdefineInjectable from @agm/core package.

This is my package.json

{
"name": "eterna-posta-web",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
  "@agm/core": "^1.0.0-beta.7",
  "@agm/js-marker-clusterer": "^1.0.0",
  "@angular/animations": "~7.1.0",
  "@angular/common": "~7.1.0",
  "@angular/compiler": "~7.1.0",
  "@angular/core": "~7.1.0",
  "@angular/forms": "~7.1.0",
  "@angular/http": "^7.1.3",
  "@angular/platform-browser": "~7.1.0",
  "@angular/platform-browser-dynamic": "~7.1.0",
  "@angular/router": "~7.1.0",
  "@microsoft/signalr": "^5.0.3",
  "@techiediaries/ngx-qrcode": "^9.1.0",
  "core-js": "^2.5.4",
  "js-marker-clusterer": "^1.0.0",
  "rxjs": "~6.3.3",
  "tslib": "^1.9.0",
  "zone.js": "~0.8.26"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.13.8",
"@angular/cli": "~7.1.2",
"@angular/compiler-cli": "~7.1.0",
"@angular/language-service": "~7.1.0",
"@types/jasmine": "~2.8.8",
"@types/jasminewd2": "~2.0.3",
  "@types/node": "~8.9.4",
  "codelyzer": "~4.5.0",
  "jasmine-core": "~2.99.1",
  "jasmine-spec-reporter": "~4.2.1",
  "karma": "~3.1.1",
  "karma-chrome-launcher": "~2.2.0",
  "karma-coverage-istanbul-reporter": "~2.0.1",
  "karma-jasmine": "~1.1.2",
  "karma-jasmine-html-reporter": "^0.2.2",
  "protractor": "~5.4.0",
  "ts-node": "~7.0.0",
  "tslint": "~5.11.0",
  "typescript": "~3.1.6"
 }
}

This is the original answer: answer

Answer 3

just make @agm/core to @agm/core": "1.0.0" and hit "npm i" this worked for me......after some research

Answer 4

In my case, I only changed version from "@agm/core": "^1.0.0-beta.5" to "@agm/core": "1.0.0".

For angular 7, 8 the new version "@agm/core": "1.1.0" doesn't work and "@agm/core": "^1.0.0-beta.5" neither.

Answer 5

Yash,

I solved it by taking a clone of my project in a new folder and then upgraded the NPM version and installed node_modules again.

Answer 6

Try removing your node_modules folder, and package-lock.json file, then rerun npm install

Or, run npm i --force, the force flag will force npm to fetch remote resources even if a local copy exists on disk.

And lastly, you can try reinstalling npm:

$ npm i -g npm