errore TS1086: un accessor non può essere dichiarato in un contesto ambientale in Angular 9

Sto imparando il materiale angolare e ricevo questo errore durante l'importazione di {MatButtonModule} da "@ angular / material / button".

Da quello che ho letto in altre risposte, sembrano problemi di compatibilità dei pacchetti ma non sono riuscito a risolverlo.

Ecco l'errore completo

ERROR in node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(29,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(30,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(128,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(129,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(134,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/focus-trap/focus-trap.d.ts(135,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/key-manager/list-key-manager.d.ts(96,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/key-manager/list-key-manager.d.ts(98,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/live-announcer/live-announcer.d.ts(69,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/a11y/live-announcer/live-announcer.d.ts(70,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/observers/observe-content.d.ts(62,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/observers/observe-content.d.ts(63,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/observers/observe-content.d.ts(66,9): error TS1086: An accessor cannot be declared in an ambient context.
    node_modules/@angular/cdk/observers/observe-content.d.ts(67,9): error TS1086: An accessor cannot be declared in an ambient context.

Ecco il mio package.json

"name": "football",
  "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": {
    "@angular/animations": "~8.2.14",
    "@angular/cdk": "^9.0.0",
    "@angular/common": "~8.2.14",
    "@angular/compiler": "~8.2.14",
    "@angular/core": "~8.2.14",
    "@angular/forms": "~8.2.14",
    "@angular/material": "8.2.3",
    "@angular/platform-browser": "~8.2.14",
    "@angular/platform-browser-dynamic": "~8.2.14",
    "@angular/router": "~8.2.14",
    "hammerjs": "^2.0.8",
    "rxjs": "~6.4.0",
    "tslib": "^1.10.0",
    "zone.js": "~0.9.1"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.803.21",
    "@angular/cli": "~8.3.21",
    "@angular/compiler-cli": "~8.2.14",
    "@angular/language-service": "~8.2.14",
    "@types/node": "~8.9.4",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "codelyzer": "^5.0.0",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.1.0",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.4.0",
    "protractor": "~5.4.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.5.3"
  }
}

angular angular-material

— Pablo Aguirre de Souza
fonte

Risposte:

Secondo package.json, stai usando Angular 8.3, ma hai importato angular / cdk v9. È possibile eseguire il downgrade della versione angolare / cdk oppure è possibile aggiornare la versione angolare alla v9 eseguendo:

ng update @angular/core @angular/cli

Questo aggiornerà la tua versione angolare locale a 9. Quindi, solo per sincronizzare il materiale, esegui: ng update @angular/material

— Kyler Johnson
fonte

Grazie, ho riscontrato questo problema quando ho installato il flex angolare che installava automaticamente l'ultima versione (nel mio caso la versione 9) ma stavo lavorando con l'

— angular

@Kyler Johnson come posso downgred angular / cdk

— mdkamrul

@mdkamrul puoi eseguire il downgrade eseguendo npm i @angular/core@8 @angular/cli@8 @angular/material@8, supponendo che tu fossi sulla versione 8. A volte il tuo package.json e package-lock.json non saranno sincronizzati e il tuo progetto utilizzerà ciò che è all'interno del file package-lock.json. Quindi ora corri npm iper sincronizzarli. Se in seguito riscontri ancora problemi, corri npm cia fare un'installazione completamente pulita delle tue dipendenze

— Kyler Johnson,

Ho dovuto usare ng update @angular/cli @angular/core --force, perché i pacchetti sono di per sé incompatibili e non è possibile passare diversamente.

— test del

Per prima cosa, controlla nel module.tsfile che in @NgModuletutte le proprietà ci siano solo una volta. Se uno di questi è più di una volta, viene visualizzato anche questo errore. Perché avevo anche riscontrato questo errore, ma nella proprietà del module.tsfile entryComponentserano due volte, ecco perché stavo ottenendo questo errore. Ho risolto questo errore rimuovendolo una volta entryComponentsda @NgModule. Quindi, ti consiglio di controllarlo prima.

— Rohit Tagadiya
fonte