Cet article vous fera découvrir les nouvelles fonctionnalités de Angular10. Il a une certaine valeur de référence. Les amis dans le besoin peuvent s'y référer. J'espère qu'il sera utile à tout le monde.
Angular 10 est une mise à niveau majeure du populaire framework de développement Web et est généralement disponible en version officielle le 24 juin. La mise à niveau de la version officielle est basée sur le framework basé sur TypeScript développé par Google, qui se concentre davantage sur la qualité, les outils et les fonctionnalités d'amélioration de l'écosystème que la nouvelle version.
Angular 10 est plus petit que les versions Angular précédentes. Les nouvelles fonctionnalités incluent un nouveau sélecteur de plage de dates et des avertissements d'importation CommonJS dans la bibliothèque de composants Angular Material UI. Les avertissements d'importation CommonJS alertent les développeurs lors de l'utilisation de dépendances fournies avec CommonJS qui pourraient entraîner des applications plus volumineuses et plus lentes, permettant aux développeurs de remplacer les packages de modules ECMAScript.
Recommandations de didacticiel associées : "tutoriel angulaire"
De plus, les paramètres stricts facultatifs fournissent des paramètres de projet plus stricts lors de la création d'un nouvel espace de travailng new
, via ng new -- strict
. L'activation de cet indicateur initialisera les nouveaux projets avec de nouveaux paramètres pour améliorer la maintenabilité, aider à détecter les erreurs et permettre à la CLI d'effectuer des optimisations avancées sur l'application.
Où télécharger Angular 10
Vous pouvez trouver la version générale d'Angular 10 sur GitHub. Pour mettre à jour votre installation Angular actuelle, vous pouvez exécuter la commande suivante :
ng update @angular/cli @angular/core
Copier après la connexion
Nouvelles fonctionnalités d'Angular 10
Les principales fonctionnalités d'Angular 10 inclure :
- TSlib, la bibliothèque d'exécution TypeScript contenant des fonctions d'assistance, a été mise à jour vers TSlib 2.0. L'outil d'analyse statique TSLint pour TypeScript a été mis à jour vers TSLint 6.
- Ajout d'une interface de compilateur qui enveloppe le véritable compilateur ngtsc. Le compilateur spécifique au service de langage utilise l'interface du projet pour gérer plusieurs fichiers de vérification de type et créer des Scriptinfos selon les besoins.
- La configuration du navigateur pour les nouveaux projets a été mise à jour pour exclure les navigateurs plus anciens et moins utilisés. Internet Explorer 9, Internet Explorer 10 et Internet Explorer Mobile ne sont pas pris en charge.
- Le format de package Angular ne contient plus de packages ESM5 ou FESM5, ce qui permet d'économiser du temps de téléchargement et d'installation lors de l'exécution de
yarn
ou npm install
pour les packages et bibliothèques Angular.
- Pour le compilateur, des portées de nom ont été ajoutées pour la lecture des propriétés et l'appel de méthode.
-
EntryPointFinder
, qui est un outil de recherche de point d'entrée basé sur un programme qui obtient des graines à partir des importations dans le programme spécifié par le fichier tsjconfig.json. Cela devrait être plus rapide que DirectoryWalkerEntryPointFinder
lorsque le programme actif importe uniquement un petit ensemble de points d'entrée installés.
- La fonctionnalité de saisie semi-automatique a été supprimée des entités HTML comme
&
en raison de problèmes de valeur et de performances douteux.
- Mappage explicite de l'exposition de fermeture au fichier devmode. Cette fonctionnalité cible les outils de développement qui doivent convertir les entrées de build de production en mode de développement équivalent.
- Un changement majeur est de rendre
ModuleWithProviders
obligatoireModuleWithProviders
. Pour que le modèle ModuleWithProviders
fonctionne avec le pipeline de compilation et de rendu Ivy, un paramètre de type générique est requis, mais avant cette soumission, View Engine autorisait l'omission des types génériques. Les migrations de la version 10 mettront à jour le code si les développeurs utilisent ModuleWithProviders
sans types génériques. Cependant, si un développeur utilise View Engine et s'appuie sur une bibliothèque qui ignore les types génériques, une erreur de build sera émise. Dans ce cas, ngcc n'aidera pas et la migration ne couvrira que le code de l'application. Les auteurs de bibliothèques doivent être contactés pour réparer leurs bibliothèques. Pour contourner le problème, vous pouvez définir skipLibChecks sur false dans tsconfig ou mettre à jour l'application pour utiliser uniquement Ivy.
- Comprend désormais TypeScript 3.9 et la prise en charge de TypeScript 3.8 a été supprimée. Il s’agit d’un changement majeur. TypeScript 3.6 et TypeScript 3.7 ne sont également plus pris en charge.
- Les performances de la vérification de type ont été améliorées dans la CLI du compilateur.
- Pour améliorer les performances, le calcul de
basePaths
a été différé, le travail n'est donc effectué que lorsque TargetedEntryPointFinder
en a besoin. Auparavant, basePaths
était évalué à chaque fois que le chercheur était instancié, ce qui gaspillait des efforts lorsque le point d'entrée cible avait déjà été traité.
- Prend en charge la fusion de plusieurs fichiers de traduction. Auparavant, un seul fichier de traduction était autorisé par paramètre régional. Les utilisateurs peuvent désormais spécifier plusieurs fichiers par paramètres régionaux et les transactions pour chaque fichier seront fusionnées par ID de messagerie.
- Le délai d'expiration du verrouillage asynchrone peut être configuré. Cela ajoute la prise en charge du fichier ngcc.config.js pour définir les options
retryAttempts
et retryDelay
. Les tests d'intégration comportent de nouveaux contrôles de délai d'attente ajoutés et des délais d'attente réduits à l'aide de ngcc.config.js pour éviter que les tests ne prennent trop de temps.
- Dans le cadre d'un changement radical, les avertissements concernant des éléments inconnus sont désormais enregistrés comme des erreurs. Bien que cela ne casse pas l'application, cela peut déclencher certains outils qui s'attendent à ce que rien ne soit enregistré via console.error.
- Dans un autre changement radical, tout retour
EMPTY
analyseur annulera la navigation. Pour que la navigation continue, le développeur doit mettre à jour l'analyseur pour mettre à jour certaines valeurs, telles que default!Empty
.
- Ajout d'informations sur les dépendances et du sélecteur ng-content dans les métadonnées. La fonctionnalité de compilateur proposée fournira des métadonnées supplémentaires utiles pour des outils tels que Angular Language Service, avec la possibilité de fournir des suggestions de directives/composants définis dans la bibliothèque.
- Améliorations des performances grâce à la réduction de la taille du manifeste du point d'entrée et aux techniques de mise en cache dans le manifeste. De plus, la mise en cache des dépendances est effectuée dans le manifeste du point d'entrée et lue à partir de là au lieu de la calculer à chaque fois. Auparavant, même si le point d'entrée n'avait pas besoin d'être traité, ngcc (Angular Ivy Compatibility Compiler) analysait le fichier du point d'entrée pour calculer les dépendances, ce qui prenait beaucoup de temps pour les modules large_node.
- Pour améliorer les performances de ngcc, le signalement immédiat des fichiers de verrouillage obsolètes est désormais autorisé. De plus, une copie en cache du fichier tsconfig analysé est stockée, qui peut être réutilisée si le chemin tsconfig est le même.
- Dans un changement radical, la logique a été mise à jour impliquant le formatage de l'heure du jour pour minuit. Lors du formatage d'une heure à l'aide des codes de format
b
ou B
, la chaîne rendue ne gère pas correctement les heures d'ensoleillement qui s'étendent sur plusieurs jours. Au lieu de cela, la logique revient au cas par défaut de AM
. Cette logique a été mise à jour afin qu'elle corresponde à l'heure de la journée après minuit, elle affichera donc désormais la sortie correcte, telle que at night
at night
pour l'anglais.Les applications utilisant les codes au format formatDate()
ou DatePipe
ou b
et B
seront affectées par ce changement.
- Pour les routeurs, le
CanLoad
protecteur peut désormais revenir Urltree
. Revenez à la Urltree
ProtectionCanLoad
de Urltree
pour annuler la navigation et la redirection en cours. Cela correspond au comportement actuel disponible pour les CanActivate
gardes, qui a également été ajouté. Cela n'affecte pas le préchargement. CanLoad
Les gardes bloquent tout préchargement ; tout itinéraire avec un CanLoad
garde ne sera pas préchargé, et le garde ne sera pas effectué dans le cadre du préchargement.
- Propagation de la plage de valeurs correcte dans l'ExpressionBinding de l'expression de microgrammaire vers l'ExpressionBinding de ParsedProperty, qui à son tour propage la plage vers le modèle AST (VE et Ivy). Ce conseil s’applique également aux compilateurs.
- Dans un correctif de base, une logique sera ajoutée aux migrations de classes non décorées pour décorer les classes dérivées de classes non décorées qui utilisent des fonctionnalités angulaires.
- En cas de changement avec rupture, le type d'Urlmatcher indiquera qu'il peut toujours renvoyer null.
- Pour les techniciens de service, une situation a été corrigée dans laquelle le technicien de service pourrait ne jamais s'inscrire lorsqu'une tâche dure longtemps ou expire.
- Un certain nombre de corrections de bugs ont été apportées, notamment le compilateur évitant les expressions non définies dans les tableaux Kong et le noyau évitant les erreurs de migration lors de l'importation de symboles inexistants. Il existe également une solution de contournement au cœur du bug d'inline Terser. Un autre correctif de bug identifie correctement les modules affectés par les substitutions dans TestBed.
- Angular NPM n'inclut plus certains commentaires jsdoc pour prendre en charge les optimisations avancées de Closure Compiler. Il s’agit d’un changement majeur. La prise en charge de Closure Compiler dans le package est expérimentale et interrompue depuis un certain temps. Toute personne utilisant Closure Compiler ferait mieux d'utiliser le package Angular construit directement à partir des sources plutôt que d'utiliser la version publiée sur NPM. Comme solution de contournement temporaire, les utilisateurs peuvent envisager de changer leur pipeline de build actuel avec l'indicateur de fermeture
--compilation_level=SIMPLE
. Cet indicateur garantira que le pipeline de construction produit des artefacts constructibles et exécutables, mais avec une taille de charge utile accrue en raison de la désactivation de l'optimisation avancée.
Traduit de : https://www.infoworld.com/article/3537449/whats-new-in-angular-10.html
Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!