Loader issue in SPFx while using react-image-focal-point

[Rahul-Trimukhe]

Node Version 16
React Version 17.0.1
npm 8.19.2

[AlRoome]

I've got the same issue. Did you manage to fix it?

[nasdan]

Do you have some codesandbox or similar to reproduce the issue? With that info we don't know if the issue is in the library

[AlRoome]

I'm building it locally, I'm running it on node version 16.16.0 React Version 16.8.5, npm version 6.14.12.

Package.json

"dependencies": {
"@microsoft/generator-sharepoint": "^1.15.2",
"@microsoft/sp-core-library": "1.10.0",
"@microsoft/sp-lodash-subset": "1.10.0",
"@microsoft/sp-office-ui-fabric-core": "1.10.0",
"@microsoft/sp-property-pane": "1.10.0",
"@microsoft/sp-webpart-base": "1.10.0",
"@pnp/pnpjs": "^1.3.0",
"@pnp/spfx-controls-react": "^1.21.1",
"@pnp/spfx-property-controls": "^3.8.0",
"@types/draft-js": "^0.10.30",
"@types/es6-promise": "0.0.33",
"@types/globalize": "0.0.34",
"@types/jquery": "^3.3.29",
"@types/react": "16.8.8",
"@types/react-big-calendar": "^0.24.6",
"@types/react-dom": "16.8.3",
"@types/webpack-env": "1.13.1",
"@uifabric/fluent-theme": "^0.16.7",
"Gulp": "npm:gulp@~3.9.1",
"browserslist": "^4.12.0",
"caniuse-lite": "^1.0.30001079",
"draft-js": "^0.10.5",
"draftjs-to-html": "^0.8.4",
"globalize": "^1.4.2",
"ical.js": "^1.5.0",
"ics-js": "^0.10.2",
"immutable": "^4.0.0-rc.12",
"jest-diff": "22.4.3",
"jquery": "^3.3.1",
"moment": "^2.24.0",
"natives": "^1.1.6",
"office-ui-fabric-react": "6.189.2",
"react": "16.8.5",
"react-accessible-accordion": "^4.0.0",
"react-big-calendar": "^0.24.6",
"react-dom": "16.8.5",
"react-draft-wysiwyg": "^1.13.2",
"react-js-pagination": "^3.0.3",
"react-loading-skeleton": "^2.2.0",
"react-responsive-modal": "^6.2.0",
"react-slick": "^0.28.1",
"rss-parser": "^3.12.0",
"sp-pnp-js": "^3.0.10",
"spfx-uifabric-themes": "^0.6.0",
"string-format": "^2.0.0",
"typescript": "^3.2.4",
"xml2js": "^0.4.19"
},
"resolutions": {
"@types/react": "16.8.8"
},
"devDependencies": {
"@microsoft/rush-stack-compiler-2.9": "0.7.7",
"@microsoft/rush-stack-compiler-3.2": "0.3.17",
"@microsoft/rush-stack-compiler-3.3": "0.3.5",
"@microsoft/sp-build-web": "^1.20.2",
"@microsoft/sp-module-interfaces": "1.10.0",
"@microsoft/sp-tslint-rules": "1.10.0",
"@microsoft/sp-webpart-workbench": "1.10.0",
"@types/chai": "3.4.34",
"@types/mocha": "2.2.38",
"@types/xml2js": "^0.4.4",
"@voitanos/jest-preset-spfx-react16": "^1.1.0",
"ajv": "~5.2.2",
"gulp": "~3.9.1",
"gulp-sequence": "1.0.0",
"gulp-stylelint": "^8.0.0",
"jest": "^23.6.0",
"karma-junit-reporter": "^1.2.0",
"stylelint": "^9.10.1",
"stylelint-config-standard": "^18.2.0",
"stylelint-scss": "^3.5.4",
"webpack-bundle-analyzer": "^3.1.0"
}
}