Error TS2307 Cannot find module @pnp/sp/presets/all in SPFx

Microsoft Teams

In this SPFx tutorial, we will discuss how to fix the error, error ts2307 cannot find module ‘@pnp/sp/presets/all’ which comes while working with SPFx client-side web parts. It also solved the below issues:

  • cannot find module ‘@pnp/sp/presets/all’
  • cannot find module ‘@pnp/sp/presets/all’.ts(2307)
  • error ts2307 cannot find module ‘@pnp/sp/presets/all’

Recently, I was working on a SharePoint framework crud operations with no javascript framework solution, and when I run the gulp server cmdlets, I received the below error:

error TS2307 cannot find module ‘@pnp/sp/presets/all’

You can see the screenshot:

error TS2307 Cannot find module
error TS2307 Cannot find module

Let us see how to fix the error, cannot find module ‘@pnp/sp/presets/all’.

You can also check the code, Cannot find module ‘@pnp/sp/presets/all’ or its corresponding type declarations.

Error TS2307 Cannot find module
Error TS2307 Cannot find module

Error TS2307 Cannot find module @pnp/sp/presets/all

As you can see here from the error message the issue is related to the PnP. I was using PnP for the SPFx CRUD operations.

Since I downloaded the SPFx project from a backup and I just run the below command to install the node_modules.

npm i

But since, I was using the PnP and the below import statements, we need to install PnP as well.

import { sp, Web, IWeb } from "@pnp/sp/presets/all";
import "@pnp/sp/lists";
import "@pnp/sp/items";

To fix the issues run the below command in the same project or solution directory.

npm i @pnp/sp

Once you run the above command, the error cannot find module ‘@pnp/sp/presets/all’.ts(2307) will not come. And you can run the gulp serve cmdlet to run the SPFx project.

You may like the following SPFx tutorials:

I hope this SPFx tutorial helps to fix the error, error ts2307 cannot find module ‘@pnp/sp/presets/all’ in SharePoint Framework (SPFx).

>