essayer d'inclure la bibliothèque d3 dans un projet TypeScript angular2. J'ai ajouté d3 via npm install d3
et les saisies via typing install d3 --save
, le serveur local du projet ne démarre pas (tsc && concurrently "npm
run tsc:w" "npm run lite"
), avec l'erreur suivante:
typings/browser/definitions/d3/index.d.ts(3319,1): error TS2300: Duplicate identifier 'export='.
typings/browser/definitions/d3/index.d.ts(3323,1): error TS2300: Duplicate identifier 'export='.
typings/browser/definitions/d3/index.d.ts(3327,1): error TS2300: Duplicate identifier 'export='.
typings/modules/d3/index.d.ts(3319,1): error TS2300: Duplicate identifier 'export='.
typings/modules/d3/index.d.ts(3323,1): error TS2300: Duplicate identifier 'export='.
typings/modules/d3/index.d.ts(3327,1): error TS2300: Duplicate identifier 'export='.
ce sont mes fichiers de configuration:
typings.json:
{
"ambientDependencies": {
"es6-shim": "github:DefinitelyTyped/DefinitelyTyped/es6-shim/es6-shim.d.ts#7de6c3dd94feaeb21f20054b9f30d5dabc5efabd",
"jasmine": "github:DefinitelyTyped/DefinitelyTyped/jasmine/jasmine.d.ts#5c182b9af717f73146399c2485f70f1e2ac0ff2b",
"gapi": "github:DefinitelyTyped/DefinitelyTyped/gapi.auth2/gapi.auth2.d.ts"
},
"dependencies": {
"d3": "registry:npm/d3#3.0.0+20160211003958"
}
}
package.json:
{
"name": "session-Explorer",
"version": "1.0.0",
"scripts": {
"start": "tsc && concurrently \"npm run tsc:w\" \"npm run lite\" ",
"lite": "lite-server",
"postinstall": "typings install",
"tsc": "tsc",
"tsc:w": "tsc -w",
"typings": "typings"
},
"license": "ISC",
"dependencies": {
"angular2": "2.0.0-beta.15",
"systemjs": "0.19.26",
"es6-shim": "^0.35.0",
"reflect-metadata": "0.1.2",
"rxjs": "5.0.0-beta.2",
"zone.js": "0.6.10",
"d3": "^3.0.0"
},
"devDependencies": {
"concurrently": "^2.0.0",
"lite-server": "^2.2.0",
"TypeScript": "^1.8.10",
"typings": "^0.7.12"
}
}
D'après le message d'erreur, il semble que vous deviez exclure vos saisies main.d.ts et les répertoires principaux.
Je suggérerais d'ajouter un tsconfig.json dans le même répertoire que votre fichier typings.json.
tsconfig.json:
{
"compilerOptions": {
"target": "es5",
"sourceMap": true,
"experimentalDecorators": true,
"emitDecoratorMetadata": true,
"module": "commonjs",
"noImplicitAny": false
},
"exclude": [
"node_modules",
"typings/main.d.ts",
"typings/main"
]
}
La angular documentation contient une bonne introduction sur le fonctionnement du fichier tsconfig.json.
Vous pouvez maintenant installer des saisies comme suit:
npm install d3 --save
npm install @types/d3 --save-dev
Ensuite, vous pouvez importer d3 comme suit
import * as d3 from 'd3';
La mise à jour 2017
Installation
Installation de types pour d3 v3 :
npm install [email protected] --save
npm install @types/[email protected] --save-dev
Installation des types pour la dernière version d3 (au moment de l’écriture v4 ):
npm install d3 --save
npm install @types/d3 --save-dev
Utilisation
import * as d3 from 'd3';
Comme il n’existe pas de frappe pour D3 V4, nous devons déclarer manuellement le fichier d.ts pour d3, par exemple
declare function d3(string: any): any;
Après avoir installé le module de noeud D3, nous pouvons importer dans le fichier en tant que
var d3: any = require('d3');
Vous devriez pouvoir importer directement d3 avec:
import * as d3 from 'd3';
tant que les typages ont été correctement installés (ce qui semble être votre cas) et que le fichier d3.js est chargé, avec une importation manuelle ou via une tâche de prétraitement utilisant le dossier node_modules/d3.
Assurez-vous également que d3.js n'est pas importé accidentellement dans la version 4.x, car cette version apporte de nombreuses modifications qui n'ont pas été intégrées dans les typages dt à ce jour.
Il y a trop de réponses différentes ici. Parce que le statut de maintien de Typed d3.
Pour l'instant, 2017/12/09, il existe déjà le type d3, avec la dernière version 4.12.0. Donc, pas besoin de passer à la version 3.x, ou de déclarer quelque chose.