NASA Proceeds to Mars

    TypeScript icon, indicating that this package has built-in type declarations

    2.9.0 • Public • Published

    Microsoft Graph Toolkit

    The Microsoft Graph Toolkit is a collection of reusable, framework-agnostic components and authentication providers for accessing and working with Microsoft Graph. The components are fully functional right of out of the box, with built in providers that authenticate with and fetch data from Microsoft Graph.

    The @microsoft/mgt package brings all mgt packages together (with the exception of @microsoft/mgt-react) and bundles them in this one convenient package.

    View the full documentation

    You can now explore components and samples with the playground.


    The Microsoft Graph Toolkit includes a collection of web components for the most commonly built experiences powered by Microsoft Graph APIs.

    The components are also available as React components.


    Providers enable authentication and provide the implementation for acquiring access tokens on various platforms and expose a Microsoft Graph Client for calling the Microsoft Graph APIs. The components work best when used with a provider, but the providers can be used on their own.

    Getting Started

    Watch the Getting Started Video

    You can use the components by referencing the loader directly (via unpkg), or installing the npm package

    Use via mgt-loader:

    <script src=""></script>

    NOTE: This link will load the highest available version of @microsoft/mgt in the range >= 2.0.0 < 3.0.0, omitting the @2 fragment from the url results in loading the latest version. This could result in loading a new major version and breaking the application.

    You can then start using the components in your html page. Here is a full working example with the Msal provider:

    <script src=""></script>
    <mgt-msal-provider client-id="[CLIENT-ID]"></mgt-msal-provider>

    NOTE: MSAL requires the page to be hosted in a web server for the authentication redirects. If you are just getting started and want to play around, the quickest way is to use something like live server in vscode.

    Use via NPM:

    The benefits of using MGT through NPM is that you have full control of the bundling process and you can bundle only the code you need for your site. First, add the npm package:

    npm install @microsoft/mgt

    Now you can reference all components and providers at the page you are using:

    <script type="module" src="node_modules/@microsoft/mgt/dist/es6/index.js"></script>
    <mgt-msal-provider client-id="[CLIENT-ID]"></mgt-msal-provider>

    Feedback and Requests

    For general questions and support, please use Stack Overflow where questions should be tagged with microsoft-graph-toolkit

    Please use GitHub Issues for bug reports and feature requests. We highly recommend you browse existing issues before opening new issues.

    Sea also


    npm i @microsoft/mgt

    DownloadsWeekly Downloads






    Unpacked Size

    12.4 MB

    Total Files


    Last publish


    • microsoft1es
    • microsoft-graph-toolkit