51 votes

erreur TS1086 : Un accesseur ne peut pas être déclaré dans un contexte ambiant dans Angular 9

Je suis en train d'apprendre Angular Material et j'obtiens cette erreur lorsque j'importe { MatButtonModule } from "@angular/material/button".

D'après ce que j'ai lu dans d'autres réponses, il semble qu'il y ait des problèmes de compatibilité des paquets, mais je n'ai pas pu les résoudre.

Voici l'erreur complète

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.

Voici mon 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"
  }
}

68voto

Kyler Johnson Points 1486

D'après votre package.json, vous utilisez Angular 8.3, mais vous avez importé angular/cdk v9. Vous pouvez rétrograder votre version angular/cdk ou vous pouvez mettre à jour votre version d'Angular vers v9 en exécutant :

ng update @angular/core @angular/cli

Cela mettra à jour votre version locale d'Angular à 9. Ensuite, juste pour synchroniser le matériel, exécutez : ng update @angular/material

2 votes

Merci, j'ai rencontré ce problème lorsque j'ai installé angular flex qui a automatiquement installé la dernière version (version 9 dans mon cas) mais je travaillais avec angular 8. La correction de la version a résolu le problème

0 votes

@Kyler johnson how can i downgred angular/cdk

2 votes

@mdkamrul vous pouvez rétrograder en exécutant npm i @angular/core@8 @angular/cli@8 @angular/material@8 en supposant que vous utilisiez la version 8. Parfois, vos fichiers package.json et package-lock.json se désynchronisent et votre projet utilise ce qui se trouve dans le fichier package-lock.json. Alors maintenant, exécutez npm i pour les synchroniser. Si vous rencontrez toujours des problèmes après cela, lancez npm ci pour faire une installation complètement propre de vos dépendances

68voto

r15 Points 3007

Ajout skipLibCheck: true en compilerOptions à l'intérieur tsconfig.json a résolu mon problème.

"compilerOptions": {
   "skipLibCheck": true,
},

4 votes

Mais le fait d'ignorer la vérification de la librairie n'entraînera-t-il pas d'autres problèmes à l'avenir ?

1 votes

Merci @R15 cela a fonctionné pour moi et j'utilise angular 8

1 votes

Vous êtes une légende absolue. Cela fonctionne à merveille. Je craignais d'utiliser l'autre solution de mise à jour de typescript, au cas où ma version d'Angular serait incompatible...

3voto

Juniorcoder Points 143

Ces problèmes sont généralement dus à un manque de concordance entre @ngx-translate/core et Angulaire Avant l'installation, vérifiez la compatibilité des versions de ngx_trnalsate/Core, @ngx-translate/http-loader et Angular correspondantes à https://www.npmjs.com/package/@ngx-translate/core

Ex : Pour les versions Angular 6.X,

npm install @ngx-translate/core@10 @ngx-translate/http-loader@3 rxjs --save

Comme ci-dessus, suivez la commande ci-dessous et le reste du code est commun à toutes les versions (Note : La version peut être obtenue à partir de( https://www.npmjs.com/package/@ngx-translate/core )

npm install @ngx-translate/core@version @ngx-translate/http-loader@version rxjs --save

1voto

sumith deepan Points 37
npm i @ionic/storage@2.2.0

cette installation va dégrader votre paquet de stockage

0voto

Rohit Tagadiya Points 1453

Veuillez d'abord vous enregistrer module.ts qu'en @NgModule toutes les propriétés sont uniques. Si l'une d'entre elles est utilisée plus d'une fois, cette erreur se produit également. En effet, j'ai également rencontré cette erreur, mais dans module.ts fichier entryComponents La propriété était à deux reprises, c'est pourquoi j'ai obtenu cette erreur. J'ai résolu cette erreur en supprimant une fois entryComponents de @NgModule . Je vous recommande donc de le vérifier d'abord correctement.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X