SharePoint Framework SPFx , no exported memeber SP, PnPJs

Question

Below is my code:

import * as React from 'react';
import styles from './PnpfolderoperationsDemo.module.scss';
import { IPnpfolderoperationsDemoProps } from './IPnpfolderoperationsDemoProps';
import { escape } from '@microsoft/sp-lodash-subset';
import { PrimaryButton } from 'office-ui-fabric-react';
import { sp } from "@pnp/sp/presets/all";

export default class PnpfolderoperationsDemo extends React.Component<IPnpfolderoperationsDemoProps, {}> {
  constructor(props){
    super(props);
    sp.setup({
      spfxContext: this.context
    });
  }
  public render(): React.ReactElement<IPnpfolderoperationsDemoProps> {
    const {
      description,
      isDarkTheme,
      environmentMessage,
      hasTeamsContext,
      userDisplayName
    } = this.props;

Executed below command for packages

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

Getting following error with pnpjs:

#Module '"@pnp/sp/presets/all"' has no exported member 'sp'.

Has anyone faced any similar situation? Thanks

Answer 1

You may be using pnpjs v3.x Your code seems to be valid for v2.x, in v3.x there are changes (global "sp" object has been deprecated). Please check the transition guide, or use v2.x

https://pnp.github.io/pnpjs/transition-guide/

To install the previous version (v2.x) that is known to be compatible with the SPFx examples you seem to be using, try specifying the version explicitly:

npm install @pnp/[email protected] @pnp/[email protected] @pnp/[email protected] @pnp/[email protected] --save