Why isn't the pnpjs sp object loading

%3CLINGO-SUB%20id%3D%22lingo-sub-870730%22%20slang%3D%22en-US%22%3EWhy%20isn't%20the%20pnpjs%20sp%20object%20loading%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-870730%22%20slang%3D%22en-US%22%3E%3CP%3EBelow%20is%20my%20code.%20It%20is%20not%20throwing%20any%20errors%20but%20the%20%22sp%22%20object%20is%20consistently%20empty.%20What%20am%20I%20doing%20wrong%3F%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CPRE%20class%3D%22lia-code-sample%20language-javascript%22%3E%3CCODE%3Eimport%20%7B%20sp%20%7D%20from%20%22%40pnp%2Fsp%22%3B%0A%20%0Aexport%20default%20class%20SharePointListWebPart%20extends%20BaseClientSideWebPart%3CISHAREPOINTLISTWEBPARTPROPS%3E%20%7B%0A%0A%20%20protected%20onInit()%3A%20Promise%3CVOID%3E%20%7B%0A%20%20%20%20return%20super.onInit().then%20(_%20%3D%26gt%3B%20%7B%0A%20%20%20%20%20%20sp.setup(%7B%0A%20%20%20%20%20%20%20%20spfxContext%3A%20this.context%0A%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20%7D)%3B%0A%20%20%7D%0A%0A%20%20public%20render()%3A%20void%20%7B%20%20%20%20%0A%20%20%20%20let%20html%20%3D%20''%3B%0A%20%20%0A%20%20%20%20%20%20console.log(%22Start%22)%3B%0A%20%20%20%20%20%20console.log(sp)%3B%0A%20%20%20%20%20%20sp.web.lists.getByTitle('Staff').get().then(function(data)%7B%0A%20%20%20%20%20%20%20%20for%20(var%20i%20%3D%200%3B%20i%20%26lt%3B%20data.length%3B%20i%2B%2B)%20%7B%0A%20%20%20%20%20%20%20%20%20%20console.log(data%5Bi%5D)%3B%0A%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%7D).catch(function(data)%7B%0A%20%20%20%20%20%20%20%20console.log(data)%3B%0A%20%20%20%20%20%20%7D)%3B%0A%20%20%20%20console.log(%22End%22)%3B%0A%20%20%20%20%0A%20%20%20%20this.domElement.innerHTML%20%3D%20%60%0A%20%20%20%20%20%20%3CDIV%20class%3D%22%24%7B%20styles.sharePointList%20%7D%22%3E%0A%20%20%20%20%20%20%20%20%24%7B%20html%20%7D%0A%20%20%20%20%20%20%3C%2FDIV%3E%60%3B%0A%20%20%7D%0A%3C%2FVOID%3E%3C%2FISHAREPOINTLISTWEBPARTPROPS%3E%3C%2FCODE%3E%3C%2FPRE%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-870730%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3Epnpjs%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E%3CLINGO-SUB%20id%3D%22lingo-sub-871208%22%20slang%3D%22en-US%22%3ERe%3A%20Why%20isn't%20the%20pnpjs%20sp%20object%20loading%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-871208%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F288947%22%20target%3D%22_blank%22%3E%40smithme%3C%2FA%3E%26nbsp%3BPlease%20make%20sure%20you%20run%20this%20command%20so%20the%20the%20import%20modules%20are%20availble%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSPAN%3Enpm%20install%20%40pnp%2Flogging%20%40pnp%2Fcommon%20%40pnp%2Fodata%20%40pnp%2Fsp%20--save%3C%2FSPAN%3E%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3E%3CSPAN%3Esecondly%20I%20am%20pretty%20sure%20you%20might%20already%20be%20doing%20this%2C%20make%20sure%20you%20run%20it%20in%20the%20share%20point%26nbsp%3Bworkbench%20rather%20than%20local.%20I%20ran%20your%20code%20it%20worked%20for%20me.%3C%2FSPAN%3E%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-872142%22%20slang%3D%22en-US%22%3ERe%3A%20Why%20isn't%20the%20pnpjs%20sp%20object%20loading%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-872142%22%20slang%3D%22en-US%22%3EI%20found%20the%20problem.%20This%20question%20is%20closed.%3C%2FLINGO-BODY%3E
Contributor

Below is my code. It is not throwing any errors but the "sp" object is consistently empty. What am I doing wrong?

 

import { sp } from "@pnp/sp";
 
export default class SharePointListWebPart extends BaseClientSideWebPart<ISharePointListWebPartProps> {

  protected onInit(): Promise<void> {
    return super.onInit().then (_ => {
      sp.setup({
        spfxContext: this.context
      });
    });
  }

  public render(): void {    
    let html = '';
  
      console.log("Start");
      console.log(sp);
      sp.web.lists.getByTitle('Staff').get().then(function(data){
        for (var i = 0; i < data.length; i++) {
          console.log(data[i]);
        }
      }).catch(function(data){
        console.log(data);
      });
    console.log("End");
    
    this.domElement.innerHTML = `
      <div class="${ styles.sharePointList }">
        ${ html }
      </div>`;
  }
2 Replies
Highlighted

@smithme Please make sure you run this command so the the import modules are availble 

npm install @pnp/logging @pnp/common @pnp/odata @pnp/sp --save

 

secondly I am pretty sure you might already be doing this, make sure you run it in the share point workbench rather than local. I ran your code it worked for me.

Highlighted
I found the problem. This question is closed.