People Picker - "@pnp/spfx-controls-react/lib/PeoplePicker" has no exported member named 'IPeoplePickerContext'

[lovethakker02]

I am trying to implement people picker in SPFx webpart. I am following this blog for the same. When I type the line below, it shows error - "@pnp/spfx-controls-react/lib/PeoplePicker" has no exported member named 'IPeoplePickerContext'

import { IPeoplePickerContext, PeoplePicker, PrincipalType } from "@pnp/spfx-controls-react/lib/PeoplePicker"; ![Uploading people picker error.JPG…]()

Category

[ ] Bug

Version

Node - 18.18.0 @pnp/spfx-controls-react - 3.17.0 office-ui-fabric-react - 7.204.0

Expected / Desired Behavior / Question

It should handle the depedency

Observed Behavior

I am not sure but it seems the dependency is missing.

Steps to Reproduce

• Create SPFx webpart.
• Install @pnp/spfx-controls-react
• Create a component for People Picker
• type import { IPeoplePickerContext, PeoplePicker, PrincipalType } from "@pnp/spfx-controls-react/lib/PeoplePicker";
• it shows error

[github-actions[bot]]

Thank you for submitting your first issue to this project.

[michaelmaillot]

Hi @lovethakker02,

The IPeoplePickerContext is an improvment available from version 3.18.0. It looks like you're using the previous version which is why you have the mentioned error message.

I'd suggest you to update the PnP Controls to latest version in order to use the new interface.

Does it answer your question?

[lovethakker02]

When I update the version using below command, I am getting error while I serve the project: npm install @pnp/spfx-controls-react@3.18.0 --save --save-exact Error- Error - [webpack] 'dist': [object Object]

So, I created a new solution and tried the latest version there. It run smoothly. I am not sure what is causing the issue in the last solution.

[lovethakker02]

The issue is happening due to separate package - @pnp/spfx-property-controls. I have installed it by mistake for @pnp/spfx-controls-react and now when I uninstalling that package, I am getting error. I reinstall the package and the above error is gone.

I will open a separate thread for this. Thank you for your support @michaelmaillot .