@pnp/sp and related dependencies upgrade?

[BassemNKhalil]

Category

• [ ] Enhancement
• [ ] Bug
• [x] Question

Version

Latest

Question

I noticed the latest package is still using @pnp\sp version 1.3.11 which is a few versions behind the current 2.8.0. Are there any known breaking changes in pnp\sp and other dependencies resulting in this decision? If not, happy to start the work to upgrade these dependencies to latest.

Thanks, Bass

[msftbot[bot]]

Thank you for reporting this issue. We will be triaging your incoming issue as soon as possible.

[petkir]

@pnp/spfx-property-controls Version 3.2 reference to 1.3.11 and @pnp/spfx-controls-react 3.3 point to 2.5.0

I think the same version would be nice. @M365Bass

[AJIXuMuK]

Hi @M365Bass - thank you for the suggestion. It makes sense to consider. But we'll need to completely reimplement PropertyFieldEnterpriseTermPicker as PnPJS v2 has other Taxonomy api.

[radityoardi]

Just for addition to this issue. I am currently having no issue using @pnp/spfx-property-controls, until when I need @pnp/sp in my SPFx literally. @pnp/spfx-property-controls still referencing to v1.3.x, while as I do npm install @pnp/sp which will install v3.x, this is where the conflict began.

running gulp serve no longer easy.

» gulp serve --nobrowser
Build target: DEBUG
[12:11:17] Using gulpfile ~\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\gulpfile.js
[12:11:17] Starting 'serve'...
[12:11:17] Starting gulp
[12:11:17] Starting subtask 'spfx-serve'...
[12:11:17] [spfx-serve] To load your scripts, use this query string: ?debug=true&noredir=true&debugManifestsFile=https://localhost:4321/temp/manifests.js
[12:11:17] Starting server...
[12:11:17] Finished subtask 'spfx-serve' after 261 ms
[12:11:17] Starting subtask 'pre-copy'...
[12:11:18] Finished subtask 'pre-copy' after 101 ms
[12:11:18] Starting subtask 'copy-static-assets'...
[12:11:18] Starting subtask 'sass'...
[12:11:18] Server started https://localhost:4321
[12:11:18] LiveReload started on port 35729
[12:11:18] Running server
[12:11:18] Finished subtask 'sass' after 657 ms
[12:11:18] Starting subtask 'tsc'...
[12:11:18] [tsc] typescript version: 4.2.4
[12:11:22] Finished subtask 'copy-static-assets' after 4.43 s
[12:11:28] Finished subtask 'tsc' after 9.81 s
[12:11:28] Starting subtask 'post-copy'...
[12:11:28] Finished subtask 'post-copy' after 198 μs
[12:11:28] Starting subtask 'configure-webpack'...
[12:11:29] Finished subtask 'configure-webpack' after 1.03 s
[12:11:29] Starting subtask 'webpack'...
[12:11:47] Warning - [webpack] 'dist':
./node_modules/@pnp/sp-clientsvc/dist/sp-clientsvc.es5.js 879:56-68
"export 'SPHttpClient' was not found in '@pnp/sp'
    at HarmonyImportSpecifierDependency._getErrors (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\dependencies\HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getWarnings (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\dependencies\HarmonyImportSpecifierDependency.js:60:15)
    at Compilation.reportDependencyErrorsAndWarnings (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1454:24)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\Hook.js:154:20)
    at Compilation.finish (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1253:28)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compiler.js:672:17
    at eval (eval at create (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:11:1)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1185:12
 @ ./node_modules/@pnp/sp-taxonomy/dist/sp-taxonomy.es5.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/services/PnPTermStorePickerService.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/propertyFields/termPicker/PropertyFieldEnterpriseTermPicker.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/propertyFields/termPicker/enterprise_index.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/PropertyFieldEnterpriseTermPicker.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/index.js
 @ ./lib/webparts/documentVisualizer/DocumentVisualizerWebPart.js
./node_modules/@pnp/sp-taxonomy/dist/sp-taxonomy.es5.js 889:8-10
"export 'sp' was not found in '@pnp/sp'
    at HarmonyImportSpecifierDependency._getErrors (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\dependencies\HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getWarnings (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\dependencies\HarmonyImportSpecifierDependency.js:60:15)
    at Compilation.reportDependencyErrorsAndWarnings (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1454:24)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\Hook.js:154:20)
    at Compilation.finish (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1253:28)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compiler.js:672:17
    at eval (eval at create (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:11:1)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1185:12
 @ ./node_modules/@pnp/spfx-property-controls/lib/services/PnPTermStorePickerService.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/propertyFields/termPicker/PropertyFieldEnterpriseTermPicker.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/propertyFields/termPicker/enterprise_index.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/PropertyFieldEnterpriseTermPicker.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/index.js
 @ ./lib/webparts/documentVisualizer/DocumentVisualizerWebPart.js
./node_modules/@pnp/sp-clientsvc/dist/sp-clientsvc.es5.js 837:15-28
"export 'toAbsoluteUrl' was not found in '@pnp/sp'
    at HarmonyImportSpecifierDependency._getErrors (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\dependencies\HarmonyImportSpecifierDependency.js:109:11)
    at HarmonyImportSpecifierDependency.getWarnings (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\dependencies\HarmonyImportSpecifierDependency.js:60:15)
    at Compilation.reportDependencyErrorsAndWarnings (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1454:24)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1258:10
    at AsyncSeriesHook.eval [as callAsync] (eval at create (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:15:1)
    at AsyncSeriesHook.lazyCompileHook (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\Hook.js:154:20)
    at Compilation.finish (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1253:28)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compiler.js:672:17
    at eval (eval at create (C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:11:1)
    at C:\Users\MYUSER\Documents\Git\MYCOMPcom\XXX-PolicyPortal\SPFx-src\node_modules\webpack\lib\Compilation.js:1185:12
 @ ./node_modules/@pnp/sp-taxonomy/dist/sp-taxonomy.es5.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/services/PnPTermStorePickerService.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/propertyFields/termPicker/PropertyFieldEnterpriseTermPicker.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/propertyFields/termPicker/enterprise_index.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/PropertyFieldEnterpriseTermPicker.js
 @ ./node_modules/@pnp/spfx-property-controls/lib/index.js
 @ ./lib/webparts/documentVisualizer/DocumentVisualizerWebPart.js

[12:11:47] Finished subtask 'webpack' after 18 s
[12:11:47] Starting subtask 'reload'...
[12:11:47] Finished subtask 'reload' after 2.7 ms

though I can avoid installing @pnp/sp of versions above v1.x and re-using the referenced version, hope the team can update the reference to the latest version soon.

[blackw212]

Hi,

I am having actually the same problems. I am using the following:

And receive the same warning. I would like, if possible, to still keep using the latest version of PnPJS and use the controls as well.

What would be a workaround / a release date for the new Property Controls library?

Thank you!

EDIT: I am actually not using the Taxonomy picker, yet i receive error for the following: PropertyFieldButtonWithCallout PropertyPaneWebPartInformation PropertyFieldMessage PropertyFieldDateTimePicker PropertyFieldNumber

Also while using CalloutTriggers.Click

[mikeschaefer]

Hi, Using SPFx 1.15.2 and my workaround for the moment is to add build.addSuppression(/@pnp/sp/gm); to gulpfile.js to suppress the warnings.

@blackw212 @radityoardi