Avertissement des décorateurs expérimentaux dans la compilation TypeScript


251

Je reçois l'avertissement ...

La prise en charge expérimentale des décorateurs est une fonctionnalité susceptible d'être modifiée dans une future version. Définissez l'option 'experimentalDecorators' pour supprimer cet avertissement.

... même si mes options de compilation dans tsconfig.json ont les paramètres suivants:

"emitDecoratorMetadata": true,
"experimentalDecorators": true,

Ce qui est bizarre, c'est que certaines classes aléatoires qui utilisent des décorateurs ne montrent pas cet avertissement, mais les autres du même projet le font.

Qu'est-ce qui pourrait provoquer un tel comportement dans le compilateur TypeScript?


19
Avez-vous essayé de redémarrer VS Code? J'ai trouvé que c'était nécessaire après avoir parfois fait des changements sur tsconfig.json.
David Sherret

2
Vous pouvez essayer coup réponse mec. Ça marche pour moi! stackoverflow.com/a/38970591/2468781
eildiz

10
Par hasard, si quelqu'un d'autre rencontre ce qui utilise VS Professional, pas VS Code, vous pouvez avoir ajouté un .tsfichier à un projet angulaire manuellement; si c'est le cas, la compilation TS par défaut est en conflit avec Angular CLI. Cliquez avec le bouton droit sur le fichier -> Propriétés -> Action de génération: aucune. Redémarrez ensuite VS si nécessaire.
pbarranis

2
Le redémarrage de VS Code m'a aidé à résoudre le problème.
CMA

4
Il m'est arrivé de démarrer VSCode ( code .) dans le mauvais répertoire. Tout semblait OK - j'ai vu et j'ai pu éditer tous mes fichiers - donc au début je n'ai rien remarqué de "mal". Mais j'ai reçu cet avertissement stupide de "décorateurs expérimentaux" sur un - et un seul! - Composante angulaire. J'ai quitté VSCode, redémarré (à code .nouveau) dans le répertoire CORRECT (ma racine de projet Angular) .. et l'avertissement a disparu.
paulsm4

Réponses:


220

Bien que VS Code soit un excellent éditeur pour les projets TypeScript, il a besoin d'un coup de pouce de temps en temps. Souvent, sans avertissement, certains fichiers le font paniquer et se plaindre. Généralement, le correctif semble être d'enregistrer et de fermer tous les fichiers ouverts, puis de les ouvrir tsconfig.json. Après cela, vous devriez pouvoir rouvrir le fichier incriminé sans erreur. Si cela ne fonctionne pas, faites mousser, rincez et répétez.

Si votre tsconfig.jsonspécifie ses fichiers source à l'aide du filestableau, IntelliSense ne fonctionnera correctement que si le fichier en question est référencé de sorte que VS Code puisse le trouver en parcourant l'arborescence des fichiers d'entrée.

Edit: La commande 'reload window' (ajoutée il y a longtemps maintenant) devrait résoudre ce problème une fois pour toutes.


5
Merci - la suppression des "fichiers" de tsconfig.json résout le problème
bensiu

4
La réponse n'était pas vraiment pertinente pour mon cas, mais d'une manière ou d'une autre m'a aidé à comprendre mon problème. J'utilise VS 2015 et entre la modification du fichier xprojet tsconfig, j'ai raté le fait que le dossier avec mes fichiers de script était répertorié dans la excludesection de tsconfig. J'espère que cela aide quelqu'un.
Stefan Balan

19
Fichier> Fermer le dossier> Ouvrir le dossier a fonctionné pour moi. Cela s'est produit après avoir redémarré la machine sans fermer correctement vscode.
Adrian Moisa

3
Que faire si je n'utilise pas de dactylographie? Seulement javascript es6?
DDD

3
Je ne sais pas quand il a été ajouté, mais la palette de commandes a maintenant "Recharger la fenêtre", ce qui est idéal pour ce genre de chose.
Coderer

187

Je dois ajouter ce qui suit dans le fichier settings.json de vscode pour supprimer l'avertissement.

"javascript.implicitProjectConfig.experimentalDecorators": true

VSCode -> Préférences -> Paramètres

entrez la description de l'image ici


Merci beaucoup. J'utilise des décorateurs es6 + et je n'ai pas installé de script. Impressionnant.
Akhmedzianov Danilian

3
Cette réponse est la meilleure, car il n'est pas nécessaire de créer un fichier séparé dans le projet pour résoudre un problème VSCode.
Rodrigo

ctrl + ,touche de raccourci pour ouvrir les paramètres utilisateur. sur les paramètres utilisateurs, cliquez sur 3 points ( ...) puis sur la Open settings.jsonsettings.json
fenêtre

Merci beaucoup. Très utile.
an0nh4x0r

102

Cette erreur se produit également lorsque vous choisissez le dossier "src" pour votre dossier d'espace de travail.

Lorsque le dossier racine, dossier où se trouvent les "src", "node_modules" est choisi, l'erreur disparaît


9
Je suis venu ici pour poster ceci. Cela m'a arrangé. J'utilisais Angular 2 via Angular CLI.
async

Dans le cas où ce qui précède n'était pas compréhensible: Vscode doit charger le dossier où le fichier de configuration doit être informé. Si vous souhaitez charger un répertoire plus bas, je suppose que vous pouvez écrire un nouveau fichier de configuration qui serait valide à partir de ce dossier et ci-dessous.
LosManos

C'était ça. Merci :)
Kamil

48

Fichier -> Préférences -> Paramètres


Pour moi, le problème est apparu sur la version 1.37 et votre solution l'a résolu.
Stephane

32

à l'intérieur de votre projet, créez le fichier tsconfig.json, puis ajoutez ces lignes

{
    "compilerOptions": {
        "experimentalDecorators": true,
        "allowJs": true
    }
}

25

dois ajouter typescript.tsdkà mon .vscode/settings.json:

"typescript.tsdk": "node_modules/typescript/lib"

5
Ceci a résolu le problème pour moi, mais cette ligne passe en .vscode/settings.jsonselon ce
Fran Rodriguez

1
Je l'ai également résolu pour moi, mais je n'avais pas le .vscodedossier (je ne sais pas pourquoi - je suis un développeur principal, laissez-moi tranquille!), Alors j'en ai créé un dans le dossier racine avec ledit settings.jsonfichier.
Aage

17

Dans VSCode, allez dans Fichier => Préférences => Paramètres (ou Contrôle + virgule) et il ouvrira le fichier Paramètres utilisateur. Recherchez "javascript.implicitProjectConfig.experimentalDecorators": true, puis cochez la case experimentalDecorators dans le fichier et il devrait le corriger. Ça l'a fait pour moi.

entrez la description de l'image ici


13

Dans Visual Code Studio, allez dans Fichier >> Préférences >> Paramètres, recherchez "décorateur" dans le champ de recherche et cochez l'option comme dans l'image. entrez la description de l'image ici


11

Ouvrir le settings.jsonfichier à l'emplacement suivant<project_folder>/.vscode/settings.json

ou vous pouvez ouvrir le fichier à partir du menu comme mentionné ci-dessous

VSCode -> File -> Preferences -> Workspace Settings

Paramètres experimentalDecorators

Ajoutez ensuite les lignes suivantes dans le settings.jsonfichier

{
    "typescript.tsdk": "node_modules/typescript/lib",
    "enable_typescript_language_service": false
}

C'est tout. Vous ne verrez aucun avertissement / erreur concernant ' experimentalDecorators '


11
J'ai obtenu "Paramètre de configuration inconnu" après avoir ajouté "enable_typescript_language_service" en utilisant vscode 1.8.1
David Cheung

5
C'est un conseil HORRIBLE si votre projet utilise Typescript!
paulsm4

1
La désactivation de "enable_typescript_language_service" désactiverait efficacement toutes les offres TypeScript linting en direct, veuillez éviter cette suggestion.
Jessy

10

Cette réponse est destinée aux personnes qui utilisent un projet Javascript et non un projet Typescript . Au lieu d'un fichier tsconfig.json , vous pouvez utiliser un fichier jsconfig.json .

Dans le cas particulier où les décorateurs vous avertissent que vous voulez écrire à l'intérieur du fichier:

{
    "compilerOptions": {
        "experimentalDecorators": true
    }
}

Pour les comportements de buggy demandés, il est toujours préférable de spécifier "include" dans le fichier de configuration et de redémarrer l'éditeur. Par exemple

{
    "compilerOptions": {
        "target": "ES6",
        "experimentalDecorators": true
    },
    "include": [
        "app/**/*"
    ],
    "exclude": [
        "node_modules"
    ]
}

10
"javascript.implicitProjectConfig.experimentalDecorators": true

Va résoudre ce problème.


1
@nadya: settings.json(utilisateur ou espace de travail). Vous pouvez également utiliser les paramètres de l'interface graphique, comme le fait cette réponse
Frank Nocke

9

Ajoutez les lignes suivantes dans tsconfig.json et redémarrez VS Code.

{
    "compilerOptions": {
        "experimentalDecorators": true,
        "target": "es5",
        "allowJs": true
    }
}

Le redémarrage a été la clé pour moi. Merci.
rynop

9

Ne pas insister sur le point, mais assurez-vous d'ajouter ce qui suit à

  • Les paramètres de l'espace de travail et non les paramètres utilisateur

sous Fichier >> Préférences >> Paramètres

"javascript.implicitProjectConfig.experimentalDecorators": vrai

cela a résolu le problème pour moi, et j'ai essayé pas mal de suggestions que j'ai trouvées ici et ailleurs.



4

Par souci de clarté et de stupidité.

1) Ouvrez .vscode / settings.json.

2) Ajoutez "typescript.tsdk": "node_modules / typescript / lib" dessus.

3) Enregistrez-le.

4) Redémarrez Visual Studio Code.


4

Si vous travaillez dans Visual studio. Vous pouvez essayer ce correctif

  1. Déchargez votre projet de Visual Studio
  2. Accédez au répertoire de base de votre projet et ouvrez le fichier "csproj".
  3. Ajoutez TypeScriptExperimentalDecorators à cette section comme indiqué dans l'image

    entrez la description de l'image ici

    1. Rechargez le projet dans Visual studio.

voir plus de détails à cet endroit.


4

Si vous utilisez cli pour compiler des fichiers * .ts, vous pouvez définir experimentalDecorators à l'aide de la commande suivante:

 tsc filename.ts --experimentalDecorators "true"

Merci, cela a sauvé ma frustation. J'avais les mêmes paramètres que le questionneur, mais j'utilisais Sublime Text 3 , et votre solution s'est avérée utile!
Irfandy Jip du

4

Veuillez vérifier que vous avez ouvert dans votre code VS le dossier de l'ensemble du projet et pas seulement le dossier src, car si vous ouvrez uniquement le src, le fichier ts.config.json (situé dans le dossier du projet) ne sera pas dans la portée, et VS ne reconnaîtra pas les paramètres des décorateurs expérimentaux.

Dans mon cas, cela a résolu tous les problèmes liés à ce problème.


C'était aussi mon problème. Pouvez-vous voir node_modules? Pouvez-vous voir tsconfig.json? Sinon, ouvrez une nouvelle fenêtre vsCode, fermez l'ancienne fenêtre, choisissez fichier -> ouvrir le dossier et assurez-vous de sélectionner le dossier parent de srcet node_modules, plutôt que de sélectionner simplement src.
Kyle Vassella

3
  1. Ouvrez VScode.
  2. Appuyez sur ctrl + virgule
  3. Suivez les instructions de la capture d'écran
    1. Recherche de décorateurs expérimentaux
    2. Éditer

2

Ouvrir le dossier complet du projet au lieu du nom du projet / src

tsconfig.json est hors du dossier src


1

J'ai corrigé l'avertissement en supprimant "baseUrl": "", du fichier tsconfig.json


1

Vous pouvez rencontrer ce problème si vous ouvrez un fichier TS qui existe en dehors du projet. Par exemple, j'utilise lerna et un fichier a été ouvert à partir d'un autre package. Bien que cet autre paquet ait son propre tsconfig avec des décorateurs expérimentaux, VsCode ne l'honore pas.


1

J'ai rencontré le même problème lors de la création d'un service injectable dans Angular 2. J'ai toutes les choses en place dans tsconfig.json .J'obtenais toujours cette erreur sur la ligne ColorsImmutable.

@Injectable()
export class ColorsImmutable {

Et le correctif consistait à enregistrer le service au niveau du module ou au niveau des composants à l'aide du tableau des fournisseurs.

providers:[ColorsImmutable ],

1

Si vous utilisez l'environnement d'exécution Deno JavaScript et TypeScript et que vous activez experimentalDecorators: true dans tsconfig.json ou les paramètres idéaux VSCode. Ça ne marchera pas. Selon l'exigence de Deno, vous devez fournir tsconfig comme indicateur lors de l'exécution d'un fichier Deno. Voir Options du compilateur TypeScript personnalisé

Dans mon cas particulier, je faisais un test Deno et je l'utilisais.

$ deno test -c tsconfig.json

S'il s'agit d'un fichier, vous avez quelque chose comme

 $ deno run -c tsconfig.json mod.ts

mon tsconfig.json

{
  "compilerOptions": {
    "allowJs": true,
    "experimentalDecorators": true,
    "emitDecoratorMetadata": true,
    "module": "esnext"
  }
}

Je fais déjà cela et pourtant pas de chance, comme ils le disent dans les documents, les fonctionnalités expérimentales ne fonctionneront pas,
Ezzabuzaid

Ça va marcher. Voir la réponse mise à jour du contenu exact de mon tsconfig.json. Ensuite, consultez ce lien github.com/manyuanrong/dso/issues/18
tksilicon

0

J'ai ajouté cette option à tsconfig.json, "baseUrl": "front-end"Remplacez front-end par le nom de votre projet angular-cli.


0

Vous pouvez également essayer avec ng build. Je viens de reconstruire l'application et maintenant elle ne se conforme pas.


0

Il s'avère donc que vous pouvez contourner ce problème en faisant correspondre le nom de votre module au nom de fichier. Si vous avez le nom de module BankSpecialtyModule, le nom de fichier doit être. bank-speciality.module.ts


0

J'ai rencontré cette erreur lorsque j'ai créé un nouveau module et déplacé mon fichier * .module.ts et * -routing.module.ts vers un autre dossier. Après avoir supprimé les deux fichiers et créé le module sur le nouveau dossier, cela fonctionne parfaitement. Environnement Angular version 9 et Angular CLI version 9.1.0


0

Pour moi, cette erreur "La prise en charge expérimentale des décorateurs est une fonctionnalité susceptible d'être modifiée dans une future version. (Etc)" ne s'est produite que dans VS Code dans un projet Angular et uniquement lors de la création d'un nouveau service.

La solution ci-dessus: «Dans Visual Code Studio, accédez à Fichier >> Préférences >> Paramètres, recherchez« décorateur »dans le champ de recherche et cochez l'option JavaScript› Configuration de projet implicite: décorateurs expérimentaux »a résolu le problème.

De plus, l'arrêt du service ng dans la fenêtre du terminal et son redémarrage ont fait disparaître l'erreur après la recompilation.

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.