web-dev-qa-db-fra.com

erreur TS2304: Build: nom introuvable "Iterable" après la mise à niveau vers Angular 4

J'utilise TypeScript 2.4.1 et j'ai mis à niveau de nombreux packages dans mon projet. Parmi eux, j'ai mis à jour Angular de 2 à 4.3.1 . Après de nombreuses corrections dans les paquets @types, les erreurs qui me restent sont les suivantes:

\node_modules\@types\jquery\index.d.ts(2955,63): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(767,24): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(771,24): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(775,24): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(779,24): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(783,24): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(787,24): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(791,24): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(795,24): error TS2304: Build:Cannot find name 'Iterable'.
\node_modules\@types\three\three-core.d.ts(799,24): error TS2304: Build:Cannot find name 'Iterable'.

J'ai trouvé beaucoup de questions et réponses similaires et la solution qui prévaut est de cibler "es2015" et/ou d'ajouter lib: ["dom", "es2015", "es2015.iterable"] . J'ai essayé tous ceux et plus mais je reste toujours avec la même erreur 'Iterable'.

Mon tsconfig.json mis à jour est donc:

{
    "compileOnSave": true,
    "compilerOptions": {
        "declaration": false,
        "emitDecoratorMetadata": true,
        "experimentalDecorators": true,
        "lib": [ "dom", "dom.iterable", "es2015", "es2015.iterable", "esnext" ],
        "module": "commonjs",
        "moduleResolution": "node",
        "noImplicitAny": true,
        "noEmitOnError": true,
        "outDir": "./wwwroot/js",
        "removeComments": false,
        "rootDir": "./Client",
        "sourceMap": true,
        "suppressImplicitAnyIndexErrors": true,
        "target": "es2015",
        "typeRoots": [
            "./node_modules/@types",
            "./Client"
        ]
    },
    "exclude": [
        "node_modules",
        "wwwroot/lib"
    ],
    "filesGlob": [
        "./Client/**/*.ts"
    ]
}

Mon package.json est:

{
    "version": "1.0.0",
    "name": "web-server",
    "private": true,
    "dependencies": {
        "@angular/common": "^4.3.1",
        "@angular/compiler": "^4.3.1",
        "@angular/core": "^4.3.1",
        "@angular/forms": "^4.3.1",
        "@angular/http": "^4.3.1",
        "@angular/platform-browser": "^4.3.1",
        "@angular/platform-browser-dynamic": "^4.3.1",
        "@angular/router": "^4.3.1",
        "@angular/upgrade": "^4.3.1",
        "bootstrap": "3.3.7",
        "core-js": "2.4.1",
        "lodash": "4.17.4",
        "pixi.js": "4.5.4",
        "reflect-metadata": "0.1.10",
        "rxjs": "^5.4.2",
        "systemjs": "0.20.17",
        "three": "0.86.0",
        "zone.js": "0.8.14"
    },
    "devDependencies": {
        "@types/chai": "^4.0.1",
        "@types/jquery": "3.2.9",
        "@types/lodash": "4.14.71",
        "@types/mocha": "2.2.41",
        "@types/pixi.js": "4.5.2",
        "@types/three": "0.84.19",
        "bower": "^1.8.0",
        "gulp": "3.9.1",
        "gulp-clean": "^0.3.2",
        "gulp-concat": "^2.6.1",
        "gulp-TypeScript": "^3.2.1",
        "gulp-inline-ng2-template": "^4.0.0",
        "gulp-sourcemaps": "^2.6.0",
        "gulp-tsc": "^1.3.2",
        "gulp-uglify": "^3.0.0",
        "merge2": "^1.1.0",
        "path": "^0.12.7",
        "rimraf": "^2.6.1",
        "systemjs-builder": "^0.16.9",
        "TypeScript": "2.4.1"
    },
    "scripts": {
        "gulp": "gulp",
        "rimraf": "rimraf",
        "bundle": "gulp bundle",
        "postbundle": "rimraf dist"
    }
}

Comment se peut-il que "iterable" ne soit pas trouvé après toutes ces inclusions??. Le compilateur TypeScript n'ignore pas mon tsconfig.json car la modification de certaines options donne différentes sorties, mais aucune sans erreur.

Mon environnement est Visual Studio 2015 Update 3 avec TypeScript Tools 2.4.1 . J'utilise npn @types (aucun typage) . La sortie de compilation verbeuse montre que Visual Studio utilise efficacement la version 2.4.1.

Et le plus étrange est que la compilation avec gulp ne génère aucune erreur avec la même version TypeScript et tsconfig.

angulartypescriptiterable
13
Oliver H.

La mise à niveau de tout mon environnement, et non du projet, a fait l'affaire… .. Je suis passée à VS2017 et tout compile désormais correctement.

Il y avait probablement une corruption dans mon installation bien que j'ai réinstallé presque tout sauf le VS2015 lui-même.

Merci à tous pour l'aide.

1
Oliver H.

'Iterable' est défini dans le fichier de typage pour le noeud. Installation du fichier qui a résolu le problème pour moi (node_modules/@types/node/index.d.ts).

npm install @types/node --save-dev
17
Will

Cela ressemble beaucoup à ce qui est décrit ici:

https://github.com/DefinitelyTyped/DefinitelyTyped/issues/16939

Donc, soit essayez d'utiliser 

"target": "es6"

comme décrit ici - ou ce qui fonctionne pour nous:

"target": "es5",
"lib": ["es2016","dom"]
13
Benjamin Seiller

La meilleure solution consiste à éliminer les saisies obsolètes et à installer les types dont vous avez réellement besoin en tant que @types.

c'est un bon guide si vous avez des dactylographies compliquées:

https://georgedyrra.com/2017/06/04/migrating-from-typings-to-npm-types/

Ceci est ma configuration résolue. Il est vraiment utile d’utiliser l’installation de npm pour mettre à niveau de angular 2 à 5 plutôt que d’essayer de modifier manuellement le fichier package.json.

La frappe semble complètement foirée après la conversion du projet angulaire 2 en angulaire 5

0
GeeWhizBang

Je suis tombé sur cette question récemment en cherchant mon problème sur Google et aucun de ceux-ci n'a résolu mon problème. J'ai dû creuser un peu, mais j'ai finalement découvert que je devais inclure le fichier de définition es6 en haut de mon fichier TypeScript racine:

///<reference path="./node_modules/TypeScript/lib/lib.es6.d.ts"/>
0
Evan Larsen

Mise à jour: La solution ci-dessous était à l'origine de problèmes de déploiement. Une meilleure solution consistait à n'exclure que tous les fichiers tsconfig.json du dossier node_modules de la solution. Semble être lié à this problème Visual Studio. 

J'ai eu un problème similaire avec les mêmes versions de Visual Studio et TypeScript. Tout fonctionnait comme prévu dans Visual Studio Code. J'ai essayé les autres suggestions postées sans succès ... la seule solution qui a été corrigée était d'exclure le dossier node_modules de mon projet mais de le laisser dans la solution.

0
Charlah