Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

SPFx 1.18.x support #1705

Closed
3 tasks done
Tanddant opened this issue Nov 21, 2023 · 13 comments
Closed
3 tasks done

SPFx 1.18.x support #1705

Tanddant opened this issue Nov 21, 2023 · 13 comments
Labels
type:enhancement New feature or enhancement of existing capability

Comments

@Tanddant
Copy link
Contributor

Category

  • Enhancement
  • Bug
  • Question

Version

Please specify what version of the library you are using: [3.15.0]

Expected / Desired Behavior / Question

Being able to install the package, and use i - I guess that's really all.

Observed Behavior

Since SPFx 1.18 changed the node version I'm having some issue, installing on a SPFx 1.18.1 solution gives me the following install log:

npm install @pnp/spfx-controls-react --save --save-exact     
                                                                                                                                               
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @rushstack/[email protected]
npm WARN Found: @rushstack/[email protected]
npm WARN node_modules/spfx-fast-serve-helpers/node_modules/@rushstack/set-webpack-public-path-plugin
npm WARN   @rushstack/set-webpack-public-path-plugin@"4.0.15" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN     @microsoft/spfx-heft-plugins@"1.18.0" from [email protected]
npm WARN     node_modules/spfx-fast-serve-helpers
npm WARN
npm WARN Could not resolve dependency:
npm WARN peerOptional @rushstack/set-webpack-public-path-plugin@"^4.0.16" from @rushstack/[email protected]
npm WARN node_modules/spfx-fast-serve-helpers/node_modules/@rushstack/webpack4-localization-plugin
npm WARN   @rushstack/webpack4-localization-plugin@"0.17.46" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @microsoft/[email protected]
npm WARN Found: @microsoft/[email protected]
npm WARN node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins/node_modules/@microsoft/load-themed-styles
npm WARN   @microsoft/load-themed-styles@"1.10.292" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN     @microsoft/spfx-heft-plugins@"1.18.0" from [email protected]
npm WARN     node_modules/spfx-fast-serve-helpers
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer @microsoft/load-themed-styles@"^2.0.70" from @microsoft/[email protected]
npm WARN node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins/node_modules/@microsoft/loader-load-themed-styles
npm WARN   @microsoft/loader-load-themed-styles@"2.0.68" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN
npm WARN Conflicting peer dependency: @microsoft/[email protected]
npm WARN node_modules/@microsoft/load-themed-styles
npm WARN   peer @microsoft/load-themed-styles@"^2.0.70" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins/node_modules/@microsoft/loader-load-themed-styles
npm WARN     @microsoft/loader-load-themed-styles@"2.0.68" from @microsoft/[email protected]
npm WARN     node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '[email protected]',
npm WARN EBADENGINE   required: { node: '>=16.13.0 <17.0.0' },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN deprecated [email protected]: spfx-uifabric-themes got replaced by hTWOo - https://my.n8d.at/hTWOo and check the updated documentation for this package: https://lab.n8d.studio/spfx-uifabric-themes/
npm WARN deprecated [email protected]: This package is no longer supported. Please use @azure/msal-browser instead.
npm WARN deprecated [email protected]: This package is no longer supported. Please use @azure/msal-browser instead.
npm WARN deprecated [email protected]: This package is no longer supported. Please use @azure/msal-browser instead.
npm WARN deprecated [email protected]: This package is no longer supported. Please use @azure/msal-browser instead.
npm WARN deprecated [email protected]: This package is no longer supported. Please use @azure/msal-browser instead.

added 293 packages, and audited 3270 packages in 3m

259 packages are looking for funding
  run `npm fund` for details

93 vulnerabilities (1 low, 66 moderate, 25 high, 1 critical)

To address issues that do not require attention, run:
  npm audit fix

To address all issues possible (including breaking changes), run:
  npm audit fix --force

Some issues need review, and may require choosing
a different dependency.

Run `npm audit` for details.

Running a gulp serve then gives me the following:

gulp serve                                                                                                                                                                                                  ─╯
Build target: DEBUG
[16:39:07] Using gulpfile D:\Project\SPFx\gulpfile.js
[16:39:07] Starting 'serve'...
[16:39:07] Starting gulp
[16:39:07] Starting subtask 'spfx-serve'...
[16:39:07] [spfx-serve] To load your scripts, use this query string: ?debug=true&noredir=true&debugManifestsFile=https://localhost:4321/temp/manifests.js
[16:39:07] Starting server...
[16:39:07] Finished subtask 'spfx-serve' after 235 ms
[16:39:07] Starting subtask 'pre-copy'...
[16:39:07] Finished subtask 'pre-copy' after 40 ms
[16:39:07] Starting subtask 'copy-static-assets'...
[16:39:07] Starting subtask 'sass'...
[16:39:07] Server started https://localhost:4321
[16:39:07] LiveReload started on port 35729
[16:39:07] Running server
Opening https://xxxxxx.sharepoint.com/sites/xxxxxxxxx/_layouts/15/SPListForm.aspx?debugManifestsFile=https%3A%2F%2Flocalhost%3A4321%2Ftemp%2Fmanifests.js&loadSPFX=true&componentId=b96f711e-ae5e-4df4-bcea-99a56012eac6&PageType=8&RootFolder=%2Fsites%2FMove-IT%2FLists%2FProjects&properties=%7B%22sampleText%22%3A%22Value%22%7D using the default OS app
[16:39:07] Finished subtask 'sass' after 86 ms
[16:39:07] Starting subtask 'lint'...
[16:39:07] [lint] eslint version: 8.7.0
[16:39:07] Starting subtask 'tsc'...
[16:39:07] [tsc] typescript version: 4.5.5
[16:39:11] Finished subtask 'copy-static-assets' after 4.32 s
[16:39:14] Finished subtask 'tsc' after 7.05 s

[16:39:17] Warning - lint - ... TOTALLY NOT 211 Lines of lint warnings

[16:39:17] Finished subtask 'lint' after 9.61 s
[16:39:17] Starting subtask 'post-copy'...
[16:39:17] Finished subtask 'post-copy' after 137 μs
[16:39:17] Starting subtask 'configure-webpack'...
[16:39:17] Finished subtask 'configure-webpack' after 675 ms
[16:39:17] Starting subtask 'webpack'...
[16:39:22] Error - [webpack] Error processing webpack stats: TypeError: Cannot read properties of undefined (reading 'toJson')
[16:39:22] Error - [webpack] Webpack error: TypeError: Cannot set properties of undefined (setting 'asyncChunks')
[16:39:22] Finished subtask 'webpack' after 5.14 s
[16:39:22] Starting subtask 'reload'...
[16:39:22] Finished subtask 'reload' after 2 ms

And nothing will load, looking at the following two lines, but I have no clue where they're coming from

[16:39:22] Error - [webpack] Error processing webpack stats: TypeError: Cannot read properties of undefined (reading 'toJson')
[16:39:22] Error - [webpack] Webpack error: TypeError: Cannot set properties of undefined (setting 'asyncChunks')

Steps to Reproduce

I get them just spinning up a SPFx 1.18.1 Project and running a npm install @pnp/spfx-controls-react --save --save-exact

I'm down to try and help out, but I have no clue where to start 😅
@ghost
Copy link

ghost commented Nov 21, 2023

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

@ghost ghost added the Needs: Triage 🔍 label Nov 21, 2023
@github-actions GitHub Actions
Copy link

Thank you for submitting your first issue to this project.

@Tanddant
Copy link
Contributor Author

Tanddant commented Nov 21, 2023 •
edited
Loading

Update!

A bit more digging, it seems to be depenant on the component, uncommenting this code snippet get's it to work

<ListItemComments
      webUrl={Statics.SiteUrls.ProjectSite}
      listId={Statics.ListIds.Tasks}
      itemId={Task.Id + ""}
      serviceScope={SPFxContext.serviceScope as any}
  />

@GuidoZam
Copy link
Contributor

Hi @Tanddant, I see a lot of errors regarding a bad engine, maybe the problem is that.

npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '[email protected]',
npm WARN EBADENGINE   required: { node: '>=16.13.0 <17.0.0' },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }

As you can see your current Node.js version is 18.17.1 but the required is >=16.13.0 <17.0.0 and this applied to most of the errors, maybe solving this will resolve all your problems 😉

@Tanddant
Copy link
Contributor Author

Tanddant commented Nov 21, 2023 •
edited
Loading

Hi @Tanddant, I see a lot of errors regarding a bad engine, maybe the problem is that.

npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '[email protected]',
npm WARN EBADENGINE   required: { node: '>=16.13.0 <17.0.0' },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }

As you can see your current Node.js version is 18.17.1 but the required is >=16.13.0 <17.0.0 and this applied to most of the errors, maybe solving this will resolve all your problems 😉

Hi @GuidoZam

I agree, but SPFx 1.18.x now uses node 18, so I'm guessing we would need to update the controls to support node 18

@GuidoZam
Copy link
Contributor

Sorry @Tanddant my bad, I misunderstood the issue. I saw that in the dev branch there is a recent merge supporting SPFx 1.18.1, maybe you should wait until it's merged on the master branch.

@Tanddant
Copy link
Contributor Author

No worries @GuidoZam, I should've been more clear in my post - or just checked the Dev branch 😂

Keeping my fingers crossed for a release soon 🤞

@GuidoZam
Copy link
Contributor

No problem 😆 finger crossed for you!

@michaelmaillot
Copy link
Collaborator

Hi @Tanddant & @GuidoZam,

A new version will be released (very) soon, supporting SPFx 1.18.1.

Stay tuned 😉

@michaelmaillot michaelmaillot added type:enhancement New feature or enhancement of existing capability and removed Needs: Triage 🔍 labels Nov 21, 2023
@joelfmrodrigues
Copy link
Collaborator

@Tanddant hey, in the meantime, it would be great if you could test using the beta release to ensure that the issue was resolved

@Tanddant
Copy link
Contributor Author

@joelfmrodrigues Tried a npm i @pnp/[email protected] - unfortunately still getting errors, but seemingly far less than before

npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @rushstack/[email protected]
npm WARN Found: @rushstack/[email protected]
npm WARN node_modules/spfx-fast-serve-helpers/node_modules/@rushstack/set-webpack-public-path-plugin
npm WARN   @rushstack/set-webpack-public-path-plugin@"4.0.15" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN     @microsoft/spfx-heft-plugins@"1.18.0" from [email protected]
npm WARN     node_modules/spfx-fast-serve-helpers
npm WARN
npm WARN Could not resolve dependency:
npm WARN peerOptional @rushstack/set-webpack-public-path-plugin@"^4.0.16" from @rushstack/[email protected]
npm WARN node_modules/spfx-fast-serve-helpers/node_modules/@rushstack/webpack4-localization-plugin
npm WARN   @rushstack/webpack4-localization-plugin@"0.17.46" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN ERESOLVE overriding peer dependency
npm WARN While resolving: @microsoft/[email protected]
npm WARN Found: @microsoft/[email protected]
npm WARN node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins/node_modules/@microsoft/load-themed-styles
npm WARN   @microsoft/load-themed-styles@"1.10.292" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN     @microsoft/spfx-heft-plugins@"1.18.0" from [email protected]
npm WARN     node_modules/spfx-fast-serve-helpers
npm WARN
npm WARN Could not resolve dependency:
npm WARN peer @microsoft/load-themed-styles@"^2.0.70" from @microsoft/[email protected]
npm WARN node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins/node_modules/@microsoft/loader-load-themed-styles
npm WARN   @microsoft/loader-load-themed-styles@"2.0.68" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN
npm WARN Conflicting peer dependency: @microsoft/[email protected]
npm WARN node_modules/@microsoft/load-themed-styles
npm WARN   peer @microsoft/load-themed-styles@"^2.0.70" from @microsoft/[email protected]
npm WARN   node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins/node_modules/@microsoft/loader-load-themed-styles
npm WARN     @microsoft/loader-load-themed-styles@"2.0.68" from @microsoft/[email protected]
npm WARN     node_modules/spfx-fast-serve-helpers/node_modules/@microsoft/spfx-heft-plugins
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '[email protected]',
npm WARN EBADENGINE   required: { node: '>=16.13.0 <17.0.0' },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN EBADENGINE Unsupported engine {
npm WARN EBADENGINE   package: '@microsoft/[email protected]',
npm WARN EBADENGINE   required: {
npm WARN EBADENGINE     node: '>=12.13.0 <13.0.0 || >=14.15.0 <15.0.0 || >=16.13.0 <17.0.0'
npm WARN EBADENGINE   },
npm WARN EBADENGINE   current: { node: 'v18.17.1', npm: '9.6.7' }
npm WARN EBADENGINE }
npm WARN deprecated [email protected]: spfx-uifabric-themes got replaced by hTWOo - https://my.n8d.at/hTWOo and check the updated documentation for this package: https://lab.n8d.studio/spfx-uifabric-themes/
npm WARN deprecated [email protected]: This package is no longer supported. Please use @azure/msal-browser instead.

added 1 package, changed 272 packages, and audited 3241 packages in 2m

259 packages are looking for funding
  run `npm fund` for details

77 vulnerabilities (1 low, 50 moderate, 25 high, 1 critical)

To address issues that do not require attention, run:
  npm audit fix

To address all issues possible (including breaking changes), run:
  npm audit fix --force

Some issues need review, and may require choosing
a different dependency.

Run `npm audit` for details.

@AJIXuMuK
Copy link
Collaborator

@Tanddant - please, remove spfx fast serve dependency from your solution.
Controls may give you warnings but not error.

@Tanddant
Copy link
Contributor Author

@AJIXuMuK - Nice spotted! - turns out the project had an older version of fast-serve installed, updating that solved the issue, and using the latest release of the controls, thanks a ton everyone! 🙌

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
type:enhancement New feature or enhancement of existing capability
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
5 participants
@Tanddant @GuidoZam @AJIXuMuK @joelfmrodrigues @michaelmaillot