Webpack 5 issues

[FredrikEkstroem]

Category

• Enhancement
• [ X] Bug
• Question

Version

3.17.0

Expected / Desired Behavior / Question

All controls should work with WebPack 5 that is used in SPFx 1.19.0

Observed Behavior

Controls that uses imports from FluentUI that are not specified in the package.json fails when using WebPack 5

Steps to Reproduce

Add a control using an unsupported import and build in a SPFx 1.19.0 project.
Examples:

//PropertyFieldSwatchColorPicker
import { getColorFromString } from '@fluentui/react/lib/utilities/color/colors';
//should instead be 
import { getColorFromString } from '@fluentui/react/lib/Color';

//PropertyFieldDropdownWithCalloutHost
import { Dropdown, IDropdownProps, IDropdownOption } from '@fluentui/react/lib/components/Dropdown';
//should instead be 
import { Dropdown, IDropdownProps, IDropdownOption } from '@fluentui/react/lib/Dropdown';

Reference: SPFx 1.19.0 - Error during build with [object Object] errors that didn't happen in previous versions

[akshataggrwal]

@FredrikEkstroem
we are also getting the same error, We tried using beta versions of above mentioned packages. However, we are not keen on using beta packages in our solutions

"@pnp/spfx-controls-react": "4.0.0-beta.6059083",
"@pnp/spfx-property-controls": "4.0.0-beta.6059131"

[JefinDX]

You can close this issue as it got resolved in v3.17.1 release.