Notes de publication sur SharePoint Framework v1.8.0

Nous publierons plus de documentation et de vidéos de conseil mises à jour au cours des prochains jours et semaines. Vos commentaires sur les ressources et les sujets nécessaires sont les bienvenus.

Publication : 14 mars 2019

Importante

Cette page traite des détails liés à une version SPFx spécifique. Cette page n’inclut pas la configuration SPFx requise supplémentaire qui doit être installée pour développer des solutions SPFx, notamment Node.js, Yeoman et d’autres outils.

Pour en savoir plus sur ces conditions préalables, voir Configuration de votre environnement de développement SharePoint Framework.

Mise à niveau des projets de v1.7.1 vers v1.8.0

1. Dans le fichier package.json du projet, identifiez tous les packages SPFx v1.7.1. Pour chaque package SPFx :

   1. Désinstallez le package v1.7.1 existant :

      npm uninstall @microsoft/{spfx-package-name}@1.7.1
      

   2. Installez le package v1.8.0 actualisé :

      npm install @microsoft/{spfx-package-name}@1.8.0.0 --save --save-exact
      

2. Assurez-vous qu’il y a une entrée dans la section devDependency du package.json qui fait référence à "@microsoft/sp-tslint-rules": "1.8.0".

3. Ajoutez un package @microsoft/rush-stack-compiler-x-x en tant que devDependency dans package.json. Consultez la section Prise en charge de TypeScript 2.7, 2.9 et 3.x (disponibilité générale) pour plus de détails sur la version correcte à utiliser.

4. Mettez à jour votre fichier tsconfig.json pour étendre la configuration TypeScript de votre version du @microsoft/rush-stack-compiler-x-x. Pour ce faire, modifiez le haut du fichier comme suit :

   • Pour @microsoft/rush-stack-compiler-2-7, le haut du fichier tsconfig.json ressemble à

     {
        "extends": "./node_modules/@microsoft/rush-stack-compiler-2.7/includes/tsconfig-web.json",
        "compilerOptions": { // ommitted for brevity }
     }
     

   • Pour @microsoft/rush-stack-compiler-3-3, le haut du fichier tsconfig.json ressemble à

     {
        "extends": "./node_modules/@microsoft/rush-stack-compiler-3.3/includes/tsconfig-web.json",
        "compilerOptions": { // ommitted for brevity }
     }
     

5. Corrigez toutes les erreurs tslint nouvelles et intéressantes qui sont maintenant générées avec un compilateur plus récent. Pour les grands projets, cela peut prendre un certain temps. Le comportement par défaut des compilateurs TypeScript devient de plus en plus strict, mais votre code n’en sera que meilleur.

Conseil

La CLI pour Microsoft 365 fournit une procédure détaillée simple pour la mise à niveau de vos solutions vers la dernière version de SharePoint Framework.

Nouvelles fonctionnalités et fonctionnalités

Développement SPFx pour les onglets Teams (disponibilité générale)

Les solutions Onglets Teams utilisant SPFx sont désormais entièrement prises en charge. Ajoutez TeamsTab à la propriété supportedHosts dans le manifeste du composant WebPart et déployez-le dans le catalogue d’applications. À partir de là, vous pouvez choisir la solution et cliquer sur le bouton « Synchroniser avec Teams ». Le composant WebPart apparaîtra désormais en tant qu’application dans teams. Lorsqu’un composant WebPart est hébergé dans un onglet Teams, il aura accès au Kit de développement logiciel (SDK) Teams via le contexte du composant WebPart. Les changements suivants ont été opérés entre la version bêta et la version 1.7 :

• Les configurations initiales et futures sont gérées à l’aide du volet Propriétés
• La propriété du manifeste canUpdateConfiguration peut être définie sur false pour désactiver la configuration après la configuration initiale
• Réduction de la surcharge JavaScript pour héberger le composant WebPart
• Fonctionnalité « Synchroniser avec Teams » pour automatiser la création et le téléchargement du manifeste Teams
• Mettre à jour teams-js vers la version v1.4.1
• Les paramètres régionaux sont pilotés par les paramètres régionaux actuels de Teams

Voir plus :

• Création d’onglets Microsoft Teams à l’aide de SharePoint Framework
• Créer un onglet Microsoft Teams à l’aide de SharePoint Framework – Tutoriel
• Créer manuellement le manifeste de Microsoft Teams pour un composant WebPart et le déployer auprès de Microsoft Teams

Pages d’applications (disponibilité générale)

Nous recevons fréquemment des demandes pour un framework d’application à page unique dans SPFx. Nous espérons que les pages d’application atteindront la majorité des objectifs liés aux applications à page unique tout en offrant un modèle de développement et une expérience utilisateur similaires. Les pages d’application sont une nouvelle mise en page moderne de SharePoint, qui héberge un seul composant WebPart sur la page entière, tout en gardant une apparence (navigation, en-tête, thème, etc.) harmonieuse. Ajout de SharePointFullPage à la propriété supportedHosts du manifeste du composant WebPart ajoutera une page d’application avec l’option de composant WebPart lors de la création d’une page.

Le composant WebPart peut être configuré (sauf si la propriété canUpdateConfiguration est définie sur false), mais la mise en page/le contenu ne peut pas être modifié. La création de pages d’application par l’utilisateur final devrait être déployée plus tard ce mois-ci avec la nouvelle expérience de création de page. En attendant, il existe une page statique (située dans _layouts/15/appPageHost.aspx?componentId=yourComponentGuidHere) qui hébergera n’importe quel composant dans une page d’application. Cette page est en cours de déploiement et devrait être disponible au moment de la publication, ou un ou deux jours plus tard, en fonction de votre client.

Voir plus :

• Utilisation des pages d’application à composant unique dans SharePoint Online

Composants WebPart isolés du domaine (disponibilité générale)

Les composants SPFx exécutés dans la page actuelle sont simples et rapides. Cependant, il existe des scénarios où un niveau d’isolement plus élevé est recommandé. Les composants WebPart isolés du domaine s’exécutent dans un iframe avec un domaine distinct, qui peut avoir des autorisations différentes de celles de la page hôte. Cela permet, par exemple, à un composant WebPart d’accéder à l’e-mail de l’utilisateur actuel sans donner à tout le code exécuté dans le client le même niveau d’accès.

Le domaine et son application AAD sont créés et gérés pour le locataire : L’administrateur du locataire devra approuver les autorisations demandées par la solution. Pour les utilisateurs finaux, le composant WebPart ressemble et se comporte comme tout autre composant WebPart. À l’heure actuelle, les composants WebPart isolés de domaine prennent uniquement en charge les données dynamiques dans le contexte de la page. Une communication complète en partie sera mise à jour ultérieurement.

Voir plus :

• Composants WebPart isolés

Composants de bibliothèque (préversion destinée aux développeurs)

Vous pouvez désormais créer des bibliothèques que d’autres composants SPFx peuvent référencer. Ils sont un peu difficiles à utiliser, nous publierons donc un document séparé qui les décrit plus en détail. Vous devez publier votre bibliothèque dans un flux npm (interne) pour la consommer.

Voir plus :

• Utilisation du type de composant bibliothèque dans SharePoint Framework
• Créer des solutions avec le type de composant de bibliothèque dans SharePoint Framework

Prise en charge de TypeScript 2.7, 2.9 et 3.x (disponibilité générale)

Dans cette version, nous avons travaillé pour séparer la version de TypeScript de la version de SPFx que vous utilisez. Vous pouvez maintenant spécifier la version de TypeScript que vous souhaitez utiliser séparément du système de génération lui-même. Vous pouvez utiliser n’importe quel compilateur répertorié ici : https://www.npmjs.com/search?q=%40microsoft%2Frush-stack-compiler.

Remarque

Le compilateur que vous utilisez doit être reflété dans votre fichier tsconfig.json, avec une référence à "extends": "./node_modules/@microsoft/rush-stack-compiler-2.7/includes/tsconfig-web.json", qui correspond à la version du compilateur rush-stack que vous incluez.

Nous avons remarqué au dernier moment que certaines versions récentes des packages @microsoft/rush-stack-compiler ne fonctionnent pas correctement. Si vous constatez que l’installation de npm donne des avertissements sur les dépendances d’homologue pour TypeScript et que la build échoue avec des plaintes de non-recherche d’un compilateur, utilisez une version antérieure du package.

Les versions suivantes du @microsoft/rush-stack-compiler doivent être utilisées avec la version DeScript correspondante.

• TypeScript v2.7
  • @microsoft/rush-stack-compiler-2.7@0.5.7
• TypeScript v2.9
  • @microsoft/rush-stack-compiler-2.9@0.6.8
• TypeScript v3.0
  • @microsoft/rush-stack-compiler-3.0@0.5.9
• TypeScript v3.3
  • @microsoft/rush-stack-compiler-3.3@0.1.6

Thème de variante de composant WebPart dans les pages modernes de SharePoint

Les pages modernes de SharePoint ont récemment publié une fonctionnalité permettant d’avoir des couleurs d’arrière-plan de section. Les composants WebPart peuvent mettre à jour leur thème pour refléter la couleur d’arrière-plan sur laquelle le composant WebPart est rendu. La définition de la propriété supportsThemeVariants dans le manifeste du composant WebPart sur true désactivera le comportement par défaut consistant à toujours afficher un arrière-plan blanc.

Les composants WebPart peuvent ensuite utiliser le ThemeProvider pour être averti des changements de couleur d’arrière-plan.

Voir plus :

• Prise en charge de la section arrière-plans

Changements dans cette version

Suppression du code PropertyPane hors @microsoft/sp-webpart-base

Nous allons déplacer le code du volet de propriétés vers un autre package (@microsoft/sp-property-pane) qui contient toute la logique du volet de propriétés qui existait précédemment dans @microsoft/sp-webpart-base. Les solutions en cours d’exécution continueront de fonctionner (nous transférerons les appels de manière appropriée), mais les API du volet de propriétés publiques sur le @microsoft/sp-webpart-base sont déconseillées dans SPFx v1.8 et seront supprimées dans la version SPFx v1.9.

Les modifications de code nécessitent de modifier le package importé. Les types et les signatures sont les mêmes mais se trouvent dans un package différent. Cela nous permet de ne charger le code du volet de propriétés (et tous ses packages dépendants) qu’en cas de besoin.

Dépréciations et éléments supprimés dans cette version

Consommation CSS héritée de Fabric

Depuis la sortie de la version v1.0 de SPFx, nous avons ajouté beaucoup de Fabric CSS à la page. Bien que nous ayons changé le fonctionnement de Fabric CSS depuis lors, nous avons continué à ajouter l’ancienne version de Fabric CSS à la page. Cela a fini par ajouter un nombre considérable de CSS inutiles. À partir de SPFx 1.8.0, les solutions ne chargeront plus l’ancien CSS Fabric.

Si votre solution doit utiliser le comportement antérieur à la version 1.8.0, ajoutez ”loadLegacyFabricCss”: true au manifeste de votre composant.

Si vos styles ne fonctionnent pas correctement après la mise à niveau vers la version 1.8.0, vous devrez peut-être modifier ce paramètre.

Au lieu de cela, votre solution peut importer la feuille de style Fabric.css comme suit :

import 'office-ui-fabric-react/dist/css/fabric.css';

Problèmes connus et limites

La nouvelle expérience de l’utilisateur final pour créer des pages d’application dépend de la nouvelle expérience Ajouter une page dans les pages modernes. Ceci est en cours de déploiement, mais la version sur votre client peut avoir quelques jours de retard.

Comme mentionné dans la section prise en charge de TypeScript, certaines des builds les plus récentes du @microsoft/rush-stack-compiler que nous utilisons rencontrent des problèmes. Les versions antérieures fonctionnent. Nous publierons des mises à jour et des notifications lorsque ces problèmes seront résolus.

Le modèle hébergé par le fournisseur mis à jour pour l’hébergement des solutions Microsoft Teams dans SharePoint Online (à l’aide du kit de développement logiciel (SDK) Teams) est toujours en préversion.

La prise en charge des données dynamiques pour les parties de domaine isolées est limitée à la source de données de contexte de page. La prise en charge complète des données dynamiques à travers la limite de l’iFrame sera disponible dans une future mise à jour.