I'm trying to build a project (https://www.learmoreseekmore.com/2021/07/ngrx-v12-an-angular-state-management-using-ngrx-data.html) that uses ngRx/data. I have the following version of Angular installed
$ ng --version
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 11.2.19
Node: 14.15.1
OS: darwin x64
Angular: 11.2.14
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Ivy Workspace: Yes
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1102.19
@angular-devkit/build-angular 0.1102.19
@angular-devkit/core 11.2.19
@angular-devkit/schematics 11.2.19
@angular/cli 11.2.19
@schematics/angular 11.2.19
@schematics/update 0.1102.19
rxjs 6.6.7
typescript 4.1.6
My angular.json file is as follows
$ cat angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"ngrx-data-example": {
"projectType": "application",
"schematics": {
"@schematics/angular:application": {
"strict": true
}
},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/ngrx-data-example",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.app.json",
"aot": true,
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.css",
"node_modules/bootstrap/dist/css/bootstrap.min.css"
],
"scripts": [
"node_modules/bootstrap/dist/js/bootstrap.min.js"
]
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"namedChunks": false,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"budgets": [
{
"type": "initial",
"maximumWarning": "500kb",
"maximumError": "1mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kb",
"maximumError": "4kb"
}
]
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "ngrx-data-example:build"
},
"configurations": {
"production": {
"browserTarget": "ngrx-data-example:build:production"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "ngrx-data-example:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "tsconfig.spec.json",
"karmaConfig": "karma.conf.js",
"assets": [
"src/favicon.ico",
"src/assets"
],
"styles": [
"src/styles.css"
],
"scripts": []
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"tsconfig.app.json",
"tsconfig.spec.json",
"e2e/tsconfig.json"
],
"exclude": [
"**/node_modules/**"
]
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "ngrx-data-example:serve"
},
"configurations": {
"production": {
"devServerTarget": "ngrx-data-example:serve:production"
}
}
}
}
}
},
"defaultProject": "ngrx-data-example"
}
I have repeatedly removed my node_modules and package-lock.json files, but after running
npm i
and then
ng serve
I keep getting the errors
Error: node_modules/@ngrx/data/src/actions/entity-action-factory.d.ts:36:21 - error TS2694: Namespace '"/Users/davea/Documents/workspace/ngrx-data-example/node_modules/@angular/core/core"' has no exported member 'ɵɵFactoryDeclaration'.
36 static ɵfac: i0.ɵɵFactoryDeclaration<EntityActionFactory, never>;
~~~~~~~~~~~~~~~~~~~~
Error: node_modules/@ngrx/data/src/actions/entity-action-factory.d.ts:37:22 - error TS2694: Namespace '"/Users/davea/Documents/workspace/ngrx-data-example/node_modules/@angular/core/core"' has no exported member 'ɵɵInjectableDeclaration'.
37 static ɵprov: i0.ɵɵInjectableDeclaration<EntityActionFactory>;
~~~~~~~~~~~~~~~~~~~~~~~
...
Error: ./node_modules/@ngrx/store/fesm2015/ngrx-store.mjs 180:29-44
Can't import the named export 'BehaviorSubject' from non EcmaScript module (only default export is available)
Error: ./node_modules/@ngrx/store/fesm2015/ngrx-store.mjs 361:29-44
Can't import the named export 'BehaviorSubject' from non EcmaScript module (only default export is available)
Error: ./node_modules/@ngrx/store/fesm2015/ngrx-store.mjs 456:20-35
Can't import the named export 'BehaviorSubject' from non EcmaScript module (only default export is available)
...
What is the appropriate version of Angular I should be using to support ngrx/data?
CodePudding user response:
You should keep both versions the same.
If you're using angular 11, you should use ngrx 11.