Getting /node_modules/@angular/core/core has no exported member ɵɵFactoryDef in Angular8

Question

Getting below error when tried to run ng serve command and also in ng build --prod.

ERROR in ../node_modules/mat-file-upload/lib/mat-file-upload.component.d.ts:21:21 - error TS2694: Namespace '"/root/storeproj/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDef'.

21     static ɵfac: i0.ɵɵFactoryDef<MatFileUploadComponent, never>;
                       ~~~~~~~~~~~~
../node_modules/mat-file-upload/lib/mat-file-upload.component.d.ts:22:18 - error TS2314: Generic type 'ɵɵComponentDefWithMeta' requires 6 type argument(s).

22     static ɵcmp: i0.ɵɵComponentDefWithMeta<MatFileUploadComponent, "mat-file-upload", never, { "labelText": "labelText"; "selectButtonText": "selectButtonText"; "selectFilesButtonType": "selectFilesButtonType"; "uploadButtonText": "uploadButtonText"; "uploadButtonType": "uploadButtonType"; "allowMultipleFiles": "allowMultipleFiles"; "showUploadButton": "showUploadButton"; "acceptedTypes": "acceptedTypes"; "customSvgIcon": "customSvgIcon"; }, { "uploadClicked": "uploadClicked"; "selectedFilesChanged": "selectedFilesChanged"; }, never, never>;
                    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
../node_modules/mat-file-upload/lib/mat-file-upload.service.d.ts:4:21 - error TS2694: Namespace '"/root/storeproj/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDef'.

4     static ɵfac: i0.ɵɵFactoryDef<MatFileUploadService, never>;

    enter code here

Angular version:

Angular CLI: 8.3.27
Node: 10.16.3
OS: linux x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.803.27
@angular-devkit/build-angular     0.803.27
@angular-devkit/build-optimizer   0.803.27
@angular-devkit/build-webpack     0.803.27
@angular-devkit/core              8.3.27
@angular-devkit/schematics        8.3.27
@angular/cdk                      7.3.7
@angular/cli                      8.3.27
@angular/http                     7.2.15
@angular/material                 7.3.7
@ngtools/webpack                  8.3.27
@schematics/angular               8.3.27
@schematics/update                0.803.27
rxjs                              6.5.3
typescript                        3.5.3
webpack                           4.39.2

npm and node version:

root@localhost storeproj]# npm --version
6.9.0
[root@localhost storeproj]# node --version
v10.16.3

Package.json

"dependencies": {
    "@angular-material-extensions/link-preview": "^1.1.1",
    "@angular/animations": "^8.2.14",
    "@angular/cdk": "^7.2.2",
    "@angular/common": "8.2.14",
    "@angular/compiler": "8.2.14",
    "@angular/core": "8.2.14",
    "@angular/forms": "8.2.14",
    "@angular/http": "7.2.15",
    "@angular/material": "^7.2.2",
    "@angular/platform-browser": "8.2.14",
    "@angular/platform-browser-dynamic": "8.2.14",
    "@angular/router": "8.2.14",
    "@kolkov/angular-editor": "^1.0.2",
    "@ng-bootstrap/ng-bootstrap": "4.0.0",
    "@ng-select/ng-select": "^2.20.5",
    "@ngx-translate/core": "11.0.0",
    "@ngx-translate/http-loader": "4.0.0",
    "angular-split": "^3.0.2",
    "chart.js": "^2.9.3",
    "chartjs-plugin-streaming": "^1.8.0",
    "core-js": "2.5.7",
    "font-awesome": "^4.7.0",
    "hammerjs": "^2.0.8",
    "jquery": "^3.4.1",
    "mat-file-upload": "^1.3.2",
    "moment": "^2.24.0",
    "ng2-ace-editor": "^0.3.9",
    "ng2-pdf-viewer": "^5.3.4",
    "ng2-tree": "^2.0.0-rc.11",
    "ngx-moment": "^3.4.0",
    "ngx-slick-carousel": "^0.5.0",
    "ngx-spinner": "^7.2.0",
    "ngx-ui-switch": "^8.2.0",
    "rxjs": "6.5.3",
    "rxjs-compat": "^6.5.3",
    "slick-carousel": "^1.8.1",
    "string-placeholder": "^1.0.2",
    "sweetalert2": "^9.5.3",
    "xlsx": "^0.15.6",
    "yarn": "1.12.1",
    "zone.js": "0.9.1"   },   "devDependencies": {
    "@angular-devkit/build-angular": "^0.803.22",
    "@angular/cli": "^8.3.22",
    "@angular/compiler-cli": "8.2.14",
    "@angular/language-service": "8.2.14",
    "@types/jasmine": "2.8.9",
    "@types/jasminewd2": "2.0.5",
    "@types/node": "^10.12.2",
    "codelyzer": "4.5.0",
    "jasmine-core": "3.3.0",
    "jasmine-spec-reporter": "4.2.1",
    "karma": "3.1.1",
    "karma-chrome-launcher": "2.2.0",
    "karma-cli": "1.0.1",
    "karma-coverage-istanbul-reporter": "2.0.4",
    "karma-jasmine": "1.1.2",
    "karma-jasmine-html-reporter": "1.4.0",
    "ng2-charts-schematics": "^0.1.7",
    "node-sass": "^4.13.0",
    "protractor": "5.4.1",
    "source-map-explorer": "^2.4.2",
    "ts-node": "7.0.1",
    "tslint": "5.11.0",
    "typescript": "3.5.3",
    "webpack-bundle-analyzer": "^3.8.0"   }

Checked multiple questions asked in StackOverflow similar to this problem, so tried deleting the node_modules and re-run npm install, still no help.

How to fix this issue?

Thanks, Mohan

Answer 1

The main reason for this error is the use of the library, which is not compatible with the Angular version you are using