Why isn't the pnpjs sp object loading

[smithme]

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]

@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.

[#3]

I found the problem. This question is closed.