@pnp/graph¶
This package contains the fluent api used to call the graph rest services.
Getting Started¶
Install the library and required dependencies
npm install @pnp/logging @pnp/core @pnp/queryable @pnp/graph --save
Import the library into your application and access the root sp object
import { graph } from "@pnp/graph";
import "@pnp/graph/groups";
(function main() {
// here we will load the current web's properties
graph.groups().then(g => {
console.log(`Groups: ${JSON.stringify(g, null, 4)}`);
});
})()
Getting Started with SharePoint Framework¶
Install the library and required dependencies
npm install @pnp/logging @pnp/core @pnp/queryable @pnp/graph --save
Import the library into your application, update OnInit, and access the root sp object in render
import { graph } from "@pnp/graph";
import "@pnp/graph/groups";
// ...
public onInit(): Promise<void> {
return super.onInit().then(_ => {
// other init code may be present
graph.setup({
spfxContext: this.context
});
});
}
// ...
public render(): void {
// A simple loading message
this.domElement.innerHTML = `Loading...`;
// here we will load the current web's properties
graph.groups().then(groups => {
this.domElement.innerHTML = `Groups: <ul>${groups.map(g => `<li>${g.displayName}</li>`).join("")}</ul>`;
});
}
Getting Started on Nodejs¶
Install the library and required dependencies
npm install @pnp/logging @pnp/core @pnp/queryable @pnp/graph @pnp/nodejs --save
Import the library into your application, setup the node client, make a request
import { graph } from "@pnp/graph";
import { AdalFetchClient } from "@pnp/nodejs";
import "@pnp/graph/groups";
// do this once per page load
graph.setup({
graph: {
fetchClientFactory: () => {
return new AdalFetchClient("{tenant}.onmicrosoft.com", "AAD Application Id", "AAD Application Secret");
},
},
});
// here we will load the groups information
graph.groups().then(g => {
console.log(`Groups: ${JSON.stringify(g, null, 4)}`);
});