angular - Kan inte läsa egenskaper av undefined (läser 'kind')


Dessa dagar utvecklar jag ett angular-CLI-projekt. Igår när jag försökte skapa en ny modul där, gav terminalen ett felmeddelande som sa

Kan inte läsa egenskaper av undefined (läser 'kind')
(det fanns inga andra förklaringar till detta fel)

Sedan upptäckte jag på samma sätt att Angular inte tillåter att skapa nya komponenter och ger samma fel. Men det finns inget problem med kommandot ng serve. Det fungerar korrekt.

Det skulle vara till stor hjälp om du hjälper mig att lösa detta problem. Jag kommer att inkludera några filer. Men om du vill ha fler detaljer, vänligen nämn dem som kommentarer eftersom jag inte kan förstå var problemet är. Tack på förhand

package.json

{
  "name": "chess-cabin-front",
  "version": "0.0.0",
  "scripts": {
    "android": "ns run android --no-hmr",
    "ios": "ns run ios --no-hmr",
    "mobile": "ns run",
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "~11.0.4",
    "@angular/cdk": "^11.2.5",
    "@angular/common": "~11.0.4",
    "@angular/compiler": "~11.0.4",
    "@angular/core": "~11.0.4",
    "@angular/forms": "~11.0.4",
    "@angular/localize": "~11.0.4",
    "@angular/material": "^11.2.5",
    "@angular/platform-browser": "~11.0.4",
    "@angular/platform-browser-dynamic": "~11.0.4",
    "@angular/router": "~11.0.4",
    "@ctrl/ngx-emoji-mart": "^6.0.0",
    "@nativescript/angular": "~10.1.0",
    "@nativescript/core": "~7.0.0",
    "@nativescript/theme": "~2.5.0",
    "@ng-bootstrap/ng-bootstrap": "^9.1.3",
    "@types/jquery": "^3.5.5",
    "admin-lte": "^3.1.0-rc",
    "angular-in-memory-web-api": "^0.11.0",
    "angularx-social-login": "^3.5.7",
    "bootstrap": "^4.6.0",
    "emojionearea": "^3.4.2",
    "font-awesome": "^4.7.0",
    "ionicons": "^5.2.3",
    "jquery": "^3.5.1",
    "reflect-metadata": "~0.1.12",
    "rxjs": "^6.6.0",
    "tslib": "^2.0.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1100.4",
    "@angular/cli": "~11.0.4",
    "@angular/compiler-cli": "~11.0.4",
    "@nativescript/android": "8.0.0",
    "@nativescript/schematics": "^11.2.0",
    "@nativescript/tslint-rules": "~0.0.5",
    "@nativescript/webpack": "~3.0.0",
    "@types/jasmine": "~3.6.0",
    "@types/node": "^12.11.1",
    "codelyzer": "^6.0.0",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~5.1.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.0.3",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "ngx-progressbar": "^6.1.1",
    "protractor": "~7.0.0",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~4.0.2"
  },
  "main": "main.tns.js"
}

angular.json

{
  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
  "version": 1,
  "newProjectRoot": "projects",
  "projects": {
    "Chess-Cabin-Front": {
      "projectType": "application",
      "schematics": {
        "@schematics/angular:component": {
          "style": "scss"
        },
        "@schematics/angular:application": {
          "strict": true
        }
      },
      "root": "",
      "sourceRoot": "src",
      "prefix": "app",
      "architect": {
        "build": {
          "builder": "@angular-devkit/build-angular:browser",
          "options": {
            "outputPath": "dist/Chess-Cabin-Front",
            "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.scss",
              "node_modules/@ctrl/ngx-emoji-mart/picker.css",
              "node_modules/bootstrap/dist/css/bootstrap.min.css"
            ],
            "scripts": [
              "node_modules/jquery/dist/jquery.min.js",
              "webpack.config.js"
            ],
            "allowedCommonJsDependencies": [
              "$.widget.bridge('uibutton', $.ui.button)",
              "admin-lte/plugins/bootstrap/js/bootstrap.bundle.min.js",
              "admin-lte/plugins/overlayScrollbars/js/jquery.overlayScrollbars.min.js",
              "admin-lte/dist/js/adminlte.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": "Chess-Cabin-Front:build"
          },
          "configurations": {
            "production": {
              "browserTarget": "Chess-Cabin-Front:build:production"
            }
          }
        },
        "extract-i18n": {
          "builder": "@angular-devkit/build-angular:extract-i18n",
          "options": {
            "browserTarget": "Chess-Cabin-Front: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.scss"
            ],
            "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": "Chess-Cabin-Front:serve"
          },
          "configurations": {
            "production": {
              "devServerTarget": "Chess-Cabin-Front:serve:production"
            }
          }
        }
      }
    }
  },
  "defaultProject": "Chess-Cabin-Front",
  "cli": {
    "defaultCollection": "@nativescript/schematics"
  }
}

Svar #1

Jag har stött på samma problem (med Angular v15.1.0 och TS v4.8.3), uppgradering av TypeScript till v4.9.4 löste det för mig!

Svar #2

Jag hade samma problem, i mitt fall använde jag animationer i mina egna komponenter, så Browser animations-modulen var redan inkluderad.

Svaret finns i detta forum, jag lade just till @angular/material utan att inkludera animationsmodulen

.

Relaterade artiklar