diff --git a/src/v2/guide/typescript.md b/src/v2/guide/typescript.md index 2e0495b6c6..82ce0799d8 100644 --- a/src/v2/guide/typescript.md +++ b/src/v2/guide/typescript.md @@ -1,28 +1,28 @@ --- -title: TypeScript Support (En) +title: Support de TypeScript type: guide order: 25 --- -## Important 2.2 Change Notice for TS + webpack 2 users +## Changements importants dans la 2.2 pour les utilisateurs TS + webpack 2 -
**Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vuejs.org).**
In Vue 2.2 we introduced dist files exposed as ES modules, which will be used by default by webpack 2. Unfortunately, this introduced an unintentional breaking change because with TypeScript + webpack 2, `import Vue = require('vue')` will now return a synthetic ES module object instead of Vue itself.
+Dans Vue 2.2 nous avons introduit des fichiers de distribution en tant que modules ES, qui seront utilisés par défaut par webpack 2. Malheureusement, cela a introduit un changement de non retrocompatiblilité non souhaité car avec TypeScript + webpack 2, `import Vue = require('vue')` retourne maintenant un objet module ES synthétique au lieu de Vue lui-même. -We plan to move all official declarations to use ES-style exports in the future. Please see [Recommended Configuration](#Recommended-Configuration) below on a future-proof setup. +Nous avons prévu de bouger toutes les déclarations officielles d'export dans le style ES dans le futur. Veuillez consulter [la configuration recommandée](#Configuration-recommandee) ci-dessous qui est parée pour les évolutions futures. -## Official Declaration in NPM Packages +## Déclaration officielle dans les packages npm -A static type system can help prevent many potential runtime errors, especially as applications grow. That's why Vue ships with [official type declarations](https://github.com/vuejs/vue/tree/dev/types) for [TypeScript](https://www.typescriptlang.org/) - not only in Vue core, but also for [vue-router](https://github.com/vuejs/vue-router/tree/dev/types) and [vuex](https://github.com/vuejs/vuex/tree/dev/types) as well. +Un système de typage statique peut aider à prévenir des erreurs d'exécutions potentielles, et particulièrement quand les applications grandissent. C'est pourquoi Vue est fourni avec des déclarations de types officielles]((https://github.com/vuejs/vue/tree/dev/types) pour [TypeScript](https://www.typescriptlang.org/), et pas seulement pour le cœur de Vue, mais aussi pour [vue-router](https://github.com/vuejs/vue-router/tree/dev/types) et [vuex](https://github.com/vuejs/vuex/tree/dev/types). -Since these are [published on NPM](https://unpkg.com/vue/types/), and the latest TypeScript knows how to resolve type declarations in NPM packages, this means when installed via NPM, you don't need any additional tooling to use TypeScript with Vue. +Puisque ceux-ci sont [publiés sur npm](https://unpkg.com/vue/types/), et que la dernière version de TypeScript sait comment résoudre des déclarations de type dans des packages npm, cela signifie qu'installer ceux-ci via npm ne requiert aucun outil supplémentaire pour utiliser TypeScript avec Vue. -## Recommended Configuration +## Configuration recommandée ``` js // tsconfig.json { "compilerOptions": { - // ... other options omitted + // ... les autres options sont omises "allowSyntheticDefaultImports": true, "lib": [ "dom", @@ -33,39 +33,39 @@ Since these are [published on NPM](https://unpkg.com/vue/types/), and the latest } ``` -Note the `allowSyntheticDefaultImports` option allows us to use the following: +Notez que l'option `allowSyntheticDefaultImports` nous permet d'utiliser l'import comme ceci : ``` js import Vue from 'vue' ``` -instead of: +plutôt que comme cela : ``` js import Vue = require('vue') ``` -The former (ES module syntax) is recommended because it is consistent with recommended plain ES usage, and in the future we are planning to move all official declarations to use ES-style exports. +La premiere (syntaxe de module ES) est recommandée car elle est cohérente avec les recommandations d'usage ES. Nous planifions à l'avenir de changer toutes les déclarations officielles pour utiliser les exports dans le style ES. -In addition, if you are using TypeScript with webpack 2, the following is also recommended: +De plus, si vous utilisez TypeScript avec webpack 2, les options suivantes sont également recommandées : ``` js { "compilerOptions": { - // ... other options omitted + // ... les autres options sont omises "module": "es2015", "moduleResolution": "node" } } ``` -This tells TypeScript to leave the ES module import statements intact, which in turn allows webpack 2 to take advantage of ES-module-based tree-shaking. +Ceci demande à TypeScript de laisser les instructions d'import de modules ES intactes, ce qui permet à webpack 2 de tirer parti du *tree-shaking* basé sur les modules ES. -See [TypeScript compiler options docs](https://www.typescriptlang.org/docs/handbook/compiler-options.html) for more details. +Voir [les options de compilation TypeScript](https://www.typescriptlang.org/docs/handbook/compiler-options.html) pour plus de détails. -## Using Vue's Type Declarations +## Utiliser la déclaration de type Vue -Vue's type definition exports many useful [type declarations](https://github.com/vuejs/vue/blob/dev/types/index.d.ts). For example, to annotate an exported component options object (e.g. in a `.vue` file): +La définition de type de Vue exporte de nombreuses [déclarations de type](https://github.com/vuejs/vue/blob/dev/types/index.d.ts) utiles. Par exemple, pour annoter l'objet d'options d'un composant exporté (par ex. dans un fichier `.vue`) : ``` ts import Vue, { ComponentOptions } from 'vue' @@ -76,14 +76,14 @@ export default { } as ComponentOptions