TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator)) for effects, selectors, services [Angular 11]

时间:2021-01-10 12:08:37

标签: angular redux ngrx ngrx-store

从 angular 8 升级到 angular 11(ngrx 从 6 更新到 10)后出现此错误。如果我注释掉一个文件,我会得到另一个文件的错误。

即使我保留一个空白的效果文件或服务文件,它也会在第一行出现错误,即导出类...或@injectable

在最后一行出现错误的选择器上,即。结束括号。

注意:我有如下所示的循环依赖警告:

Warning: Circular dependency detected:
src\app\modules\login\components\index.ts -> src\app\modules\login\components\index.ts

Warning: Circular dependency detected:
src\app\modules\login\layouts\index.ts -> src\app\modules\login\layouts\index.ts

Warning: Circular dependency detected:
src\app\modules\main\components\index.ts -> src\app\modules\main\components\index.ts

Warning: Circular dependency detected:
src\app\modules\main\guards\index.ts -> src\app\modules\main\guards\index.ts

以下是版本详情:

   Angular CLI: 11.0.6
Node: 12.18.3
OS: win32 x64

Angular: 11.0.6
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router
Ivy Workspace: Yes

Package                         Version
---------------------------------------------------------
@angular-devkit/architect       0.1100.6
@angular-devkit/build-angular   0.1100.6
@angular-devkit/core            11.0.6
@angular-devkit/schematics      11.0.6
@angular/http                   7.2.16
@schematics/angular             11.0.6
@schematics/update              0.1100.6
rxjs                            6.6.3
typescript  

                4.0.5

这是我的 package.json

    {
  "name": "",
  "version": "",
  "angular-cli": {},
  "scripts": {
    "ng": "ng",
    "postinstall": "ngcc",
    "start": "ng serve",
    "remote": "ng serve --host 0.0.0.0",
    "build": "ng build --prod",
    "build:analyze": "ng build --prod --stats-json",
    "build:debug": "ng build --prod --optimization=false",
    "lint": "tslint \"src/**/*.ts\"",
  },
  "browser": { "fs": false },
  "private": true,
  "dependencies": {
    "@agm/core": "^1.1.0",
    "@angular/animations": "^11.0.5",
    "@angular/common": "^11.0.5",
    "@angular/compiler": "^11.0.5",
    "@angular/core": "^11.0.5",
    "@angular/forms": "^11.0.5",
    "@angular/http": "^7.2.16",
    "@angular/platform-browser": "^11.0.5",
    "@angular/platform-browser-dynamic": "^11.0.5",
    "@angular/router": "^11.0.5",
    "@ng-bootstrap/ng-bootstrap": "^5.3.1",
    "@ng-idle/core": "^10.0.0-beta.1",
    "@ng-idle/keepalive": "^8.0.0-beta.4",
    "@ngrx/effects": "^10.1.2",
    "@ngrx/store": "^10.1.2",
    "@ngrx/store-devtools": "^10.1.2",
    "@swimlane/ngx-datatable": "^19.0.0",
    "@types/chart.js": "^2.9.29",
    "@types/googlemaps": "^3.43.0",
    "ag-grid-angular": "^23.2.1",
    "ag-grid-community": "^23.2.1",
    "ag-grid-enterprise": "^23.2.1",
    "angular-calendar": "^0.27.21",
    "angular-draggable-droppable": "^4.6.0",
    "angular2-notifications": "^9.0.0",
    "bootstrap": "^4.5.3",
    "chart.js": "^2.9.4",
    "chartjs-plugin-datalabels": "^0.6.0",
    "chartjs-plugin-doughnutlabel": "^2.0.3",
    "clipboard": "^2.0.6",
    "core-js": "^3.8.2",
    "countries-and-timezones": "^2.3.1",
    "date-fns": "^1.30.1",
    "eventsource-polyfill": "^0.9.6",
    "favico.js-slevomat": "^0.3.11",
    "focus-trap": "2.3.0",
    "font-awesome": "^4.7.0",
    "font-awesome-animation": "^0.2.1",
    "html2canvas": "^1.0.0-rc.7",
    "jquery": "^3.5.1",
    "minimatch": "^3.0.4",
    "moment": "^2.29.1",
    "ng2-file-upload": "^1.4.0",
    "ng2-pdf-viewer": "^6.3.2",
    "ngx-chips": "^2.2.2",
    "ngx-pipes": "^2.7.5",
    "ngx-quill": "^5.2.0",
    "ngx-slimscroll": "^11.0.0",
    "ngx-socket-io": "^3.2.0",
    "oboe": "^2.1.5",
    "path": "^0.12.7",
    "quill": "^1.3.7",
    "rxjs": "^6.6.3",
    "tslib": "^2.1.0",
    "twilio-video": "^2.10.0",
    "ua-parser-js": "^0.7.23",
    "web-animations-js": "^2.3.2",
    "xlsx": "^0.16.9",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^0.1100.5",
    "@angular/cli": "^11.0.5",
    "@angular/compiler-cli": "^11.0.5",
    "@angular/language-service": "^11.0.5",
    "@angular/localize": "^11.0.5",
    "@types/jasmine": "^2.8.17",
    "@types/jasminewd2": "^2.0.8",
    "@types/node": "^14.14.20",
    "codelyzer": "^5.1.2",
    "html-dnd": "^1.2.1",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.1.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "protractor": "~7.0.0",
    "protractor-beautiful-reporter": "^1.3.6",
    "ts-node": "~5.0.1",
    "tslint": "~6.1.0",
    "typescript": "^4.0.5"
  }
}

2 个答案:

答案 0 :(得分:2)

我在将版本 10 更新到 Angular 版本 11 后遇到了这个问题,我注意到 devDependence 中的 @angular/compiler-cli@angular/language-cli旧的已更新。

在将devDependencies 与项目dependencies 平衡后,我的问题就解决了

npm install @angular/language-service@11.2.10 --save-dev
npm install @angular/compiler-cli@11.2.10 --save-dev

答案 1 :(得分:0)

在我的情况下是在编译:

[ng] Compiling @angular/core : es2015 as esm2015
[ng] Error: Error on worker #1: TypeError: undefined is not iterable (cannot read property Symbol(Symbol.iterator))
[ng]     at __read ............ /node_modules/tslib/tslib.js:193:28)

$ npm 查看 tslib

tslib@2.2.0 | 0BSD | deps: 无 |版本:31