Why isn't the pnpjs sp object loading

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>`;
  }