Des builds subséquentes plus rapides avec le drapeau --incrementalComme les fichiers TypeScript sont compilés, cela introduit une étape intermédiaire entre l'écriture et l'exécution de votre code. L'un des objectifs de Microsoft est de minimiser le temps passé en cas de modification de votre programme. Une façon de faire est d’exécuter TypeScript en mode --watch. Lorsqu’un fichier est modifié sous le mode --watch, TypeScript peut utiliser le graphe de dépendances précédemment construit de votre projet pour déterminer les fichiers susceptibles d’avoir été affectés et devant faire l’objet d’une nouvelle vérification et éventuellement d’une nouvelle émission. Cela peut éviter une vérification de type complète et une réémission qui peut être coûteuse.
Envoyé par MicrosoftMais il est irréaliste d’attendre de tous les utilisateurs qu’un processus tsc -- watch se déroule pendant la nuit, afin d’obtenir des versions plus rapides le lendemain matin. Qu'en est-il des builds froides ? Au cours des derniers mois, nous nous sommes efforcés de déterminer s’il était possible de sauvegarder les informations appropriées du mode --watch dans un fichier et de les utiliser d’une build à l’autre.
| Code TypeScript : | Sélectionner tout |
1 2 3 4 5 6 7 8 | // tsconfig.json { "compilerOptions": { "incremental": true, "outDir": "./lib" }, "include": ["./src"] } |
Par défaut, avec ces paramètres, lors de l’exécution de tsc, TypeScript recherchera un fichier appelé .tsbuildinfo dans notre répertoire de sortie (./lib). Si ./lib/.tsbuildinfo n’existe pas, il sera généré. Si tel est le cas, tsc essaiera d’utiliser ce fichier pour vérifier et mettre à jour de manière incrémentielle nos fichiers de sortie.
Ces fichiers .tsbuildinfo peuvent être supprimés en toute sécurité et n’ont aucune incidence sur notre code au moment de l’exécution - ils sont uniquement utilisés pour accélérer les compilations. Nous pouvons également leur attribuer le nom de notre choix et les placer où bon nous semble en utilisant le drapeau --tsBuildInfoFile.
| Code TypeScript : | Sélectionner tout |
1 2 3 4 5 6 7 8 9 | // front-end.tsconfig.json { "compilerOptions": { "incremental": true, "tsBuildInfoFile": "./buildcache/front-end", "outDir": "./lib" }, "include": ["./src"] } |
Projets composites
Une partie de l'intention avec les projets composites (tsconfig.jsons avec composite défini sur true) est que les références entre différents projets peuvent être générées de manière incrémentielle. En tant que tels, les projets composites produiront toujours des fichiers .tsbuildinfo.
outFile
Lorsque outFile est utilisé, le nom du fichier d’information de la build sera basé sur le nom du fichier de sortie. Par exemple, si notre fichier JavaScript de sortie est ./output/foo.js, sous l'indicateur --incremental, TypeScript générera le fichier ./output/foo.tsbuildinfo. Comme ci-dessus, cela peut être contrôlé avec l'indicateur --tsBuildInfoFile.
Le format de fichier --incremental et la gestion des versions
Bien que le fichier généré par --incremental soit JSON, le fichier n’est pas destiné à être utilisé par un autre outil. Microsoft ne peut donc fournir aucune garantie de stabilité pour son contenu et, en fait, sa politique actuelle est qu'une version quelconque de TypeScript ne comprendra pas les fichiers .tsbuildinfo générés à partir d'une autre version.
Améliorations pour les tuples ReadonlyArray et Readonly
TypeScript 3.4 facilite l'utilisation des types de type tableau en lecture seule.
Une nouvelle syntaxe pour ReadonlyArray
Le type ReadonlyArray décrit les tableaux pouvant uniquement être lus. Toute variable associée à un ReadonlyArray ne peut ajouter, supprimer ou remplacer aucun élément du tableau.
| Code TypeScript : | Sélectionner tout |
1 2 3 4 | function foo(arr: ReadonlyArray<string>) { arr.slice(); // okay arr.push("hello!"); // error! } |
Bien que ce soit souvent une bonne pratique d’utiliser ReadonlyArray sur Array à des fins d’intention, c’est souvent un problème, étant donné que les tableaux ont une syntaxe plus agréable. Spécifiquement, number [] est une version abrégée de Array<number>, tout comme Date [] est un raccourci pour Array <Date>.
TypeScript 3.4 introduit une nouvelle syntaxe pour ReadonlyArray en utilisant un nouveau modificateur readonly pour les types de tableau.
| Code TypeScript : | Sélectionner tout |
1 2 3 4 | function foo(arr: readonly string[]) { arr.slice(); // okay arr.push("hello!"); // error! } |
tuples en lecture seule
TypeScript 3.4 introduit également un nouveau support pour les tuples en lecture seule. Nous pouvons préfixer n'importe quel type de tuple avec le mot clé readonly pour en faire un tuple en lecture seule, un peu comme nous pouvons le faire avec la syntaxe abrégée de tableau. Comme vous vous en doutez, contrairement aux n-uplets ordinaires dans lesquels nous disposons de la possibilité d’écriture à des positions données, les n-uplets en lecture seule permettent uniquement de lire à partir de ces positions.
| Code TypeScript : | Sélectionner tout |
1 2 3 4 | function foo(pair: readonly [string, string]) { console.log(pair[0]); // okay pair[1] = "hello!"; // error } |
Modificateurs de type mappés en lecture seule et tableaux en lecture seule
Dans les versions antérieures de TypeScript, Microsoft généralisait les types mappés pour qu'ils fonctionnent différemment sur les types de type tableau. Cela signifiait qu'un type mappé comme Boxify pouvait fonctionner sur les tableaux et les n-uplets.
| Code TypeScript : | Sélectionner tout |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | interface Box<T> { value: T } type Boxify<T> = { [K in keyof T]: Box<T[K]> } // { a: Box<string>, b: Box<number> } type A = Boxify<{ a: string, b: number }>; // Array<Box<number>> type B = Boxify<number[]>; // [Box<string>, Box<number>] type C = Boxify<[string, boolean]>; |
Malheureusement, les types mappés tels que le type utilitaire Readonly étaient en réalité des no-ops sur les types array et tuple.
| Code TypeScript : | Sélectionner tout |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 | // lib.d.ts type Readonly<T> = { readonly [K in keyof T]: T[K] } // How code acted *before* TypeScript 3.4 // { readonly a: string, readonly b: number } type A = Readonly<{ a: string, b: number }>; // number[] type B = Readonly<number[]>; // [string, boolean] type C = Readonly<[string, boolean]>; |
Dans TypeScript 3.4, le modificateur readonly dans un type mappé convertira automatiquement les types de type tableau en leurs homologues en lecture seule correspondants....
La fin de cet article est réservée aux abonnés. Soutenez le Club Developpez.com en prenant un abonnement pour que nous puissions continuer à vous proposer des publications.