Bibliothèque SharePoint Framework pour le Kit de ressources Microsoft Graph

Article
03/26/2023
3 minutes de lecture

Utilisez la bibliothèque SharePoint Framework du Kit de ressources Microsoft Graph pour utiliser le Kit de ressources Microsoft Graph dans SharePoint Framework solutions.

Pour empêcher plusieurs composants d’inscrire leur propre ensemble de composants microsoft Graph Toolkit sur la page, vous devez déployer cette bibliothèque sur votre locataire et référencer les composants du Kit de ressources Microsoft Graph que vous utilisez dans votre solution à partir de cette bibliothèque.

Attention

La bibliothèque SharePoint Framework du Kit de ressources Microsoft Graph est destinée à être utilisée avec des extensions SharePoint Framework et des composants WebPart non isolés. Si vous créez des composants WebPart isolés, n’utilisez pas la bibliothèque SharePoint Framework pour le Kit de ressources Microsoft Graph. Au lieu de cela, chargez le Kit de ressources Microsoft Graph directement à partir du @microsoft/mgt package (ou @microsoft/mgt-react si vous utilisez React). SharePoint Framework ne prend pas en charge le référencement des composants de bibliothèque à partir de composants WebPart isolés, ce qui entraîne des erreurs d’exécution dans le composant WebPart isolé.

Conditions préalables

Avant de déployer votre package SharePoint Framework sur votre locataire, vous devez déployer le @microsoft/mgt-spfx package SharePoint Framework sur votre locataire. Vous pouvez télécharger le package qui correspond à la version de @microsoft/mgt-spfx celle que vous avez utilisée dans votre projet à partir de la section Versions sur GitHub. Ce package doit être chargé dans le catalogue d’applications et profondément sur tous les sites.

Importante

Étant donné que vous ne pouvez installer qu’une seule version de la bibliothèque SharePoint Framework pour le Kit de ressources Microsoft Graph dans un client, déterminez si votre organisation ou client dispose déjà d’une version de la bibliothèque SharePoint Framework déployée et utilisez la même version avant d’utiliser le Kit de ressources Microsoft Graph dans votre solution.

Installation

Pour charger les composants du Kit de ressources Microsoft Graph à partir de la bibliothèque, ajoutez le @microsoft/mgt-spfx package en tant que dépendance d’exécution à votre projet SharePoint Framework :

npm install @microsoft/mgt-spfx

yarn add @microsoft/mgt-spfx

Utilisation

Lorsque vous créez SharePoint Framework composants WebPart et extensions, référencez le Kit de ressources Provider Microsoft Graph et SharePointProvider à partir du @microsoft/mgt-spfx package. Cela garantit que votre solution utilisera les composants du Kit de ressources Microsoft Graph qui sont déjà inscrits sur la page, plutôt que d’instancier ses propres composants. Le processus d’instanciation est le même pour tous les composants WebPart, quelle que soit l’infrastructure JavaScript qu’ils utilisent.

import { Providers, SharePointProvider } from '@microsoft/mgt-spfx';

// [...] trimmed for brevity

export default class MgtWebPart extends BaseClientSideWebPart<IMgtWebPartProps> {
  protected async onInit() {
    if (!Providers.globalProvider) {
      Providers.globalProvider = new SharePointProvider(this.context);
    }
  }

  // [...] trimmed for brevity
}

Lors de la création de composants WebPart à l’aide d’une infrastructure autre que React, vous pouvez charger des composants directement dans votre composant WebPart :

export default class MgtNoFrameworkWebPart extends BaseClientSideWebPart<IMgtNoFrameworkWebPartProps> {
  protected async onInit() {
    if (!Providers.globalProvider) {
      Providers.globalProvider = new SharePointProvider(this.context);
    }
  }

  public render(): void {
    this.domElement.innerHTML = `
      <div>
        <mgt-person person-query="me"></mgt-person>
      </div>`;
  }

  // [...] trimmed for brevity
}

React

Si vous créez un composant WebPart à l’aide de React, vous pouvez utiliser le @microsoft/mgt-react package. Toutefois, veillez à importer tous les composants React à partir du chemin d’accès@microsoft/mgt-react/dist/es6/spfx. Cela garantit que votre solution utilise uniquement les composants du Kit de ressources Microsoft Graph qui sont déjà inscrits sur la page, au lieu d’instancier ses propres composants.

import { Person } from '@microsoft/mgt-react/dist/es6/spfx';
import { ViewType } from '@microsoft/mgt-spfx';

// [...] trimmed for brevity

export default class MgtReact extends React.Component<IMgtReactProps, {}> {
  public render(): React.ReactElement<IMgtReactProps> {
    return (
      <div className={ styles.mgtReact }>
        <Person personQuery="me" view={ViewType.image}></Person>
      </div>
    );
  }
}

Importante

Vérifiez que toutes les importations du Kit de ressources Microsoft Graph dans votre solution proviennent des éléments suivants :

@microsoft/mgt-spfx Ou
@microsoft/mgt-react/dist/es6/spfx

N’importez pas à partir d’autres packages du Kit de ressources Microsoft Graph (@microsoft/mgt-*) pour éviter d’empaqueter votre propre copie du kit de ressources et d’entrer en conflit avec la bibliothèque partagée.