Using Kendo React with Sharepoint Framework (spfx) 1.7

[jchilde]

I am able to get everything working out of the box; however, I get a large number of errors during the build process related to references to the kendo framework. Example is below.

Do you have a single example of using your grid with spfx 1.41 or higher that will compile without error.

./node_modules/@progress/kendo-react-dropdowns/dist/es/common/ListFilter.js
(Emitted value instead of an instance of Error) Cannot find source file '../../../src/common/ListFilter.tsx': Error: Can't resolve '../../../src/common/ListFilter.tsx' in 'C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules@progress\kendo-react-dropdowns\dist\es\common'
NonErrorEmittedError: (Emitted value instead of an instance of Error) Cannot find source file '../../../src/common/ListFilter.tsx': Error: Can't resolve '../../../src/common/ListFilter.tsx' in 'C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules@progress\kendo-react-dropdowns\dist\es\common'
at emitWarning (C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\webpack\lib\NormalModule.js:117:16)
at C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\source-map-loader\index.js:80:7
at onError (C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\enhanced-resolve\lib\Resolver.js:65:10)
at loggingCallbackWrapper (C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\enhanced-resolve\lib\createInnerCallback.js:31:19)
at runAfter (C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\enhanced-resolve\lib\Resolver.js:158:4)
at innerCallback (C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\enhanced-resolve\lib\Resolver.js:146:3)
at loggingCallbackWrapper (C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\enhanced-resolve\lib\createInnerCallback.js:31:19)
at next (C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\tapable\lib\Tapable.js:252:11)
at C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\enhanced-resolve\lib\UnsafeCachePlugin.js:40:4
at loggingCallbackWrapper (C:\Users\StewartLawyer\Documents\GitHub\React-SPFX-Telerik\node_modules\enhanced-resolve\lib\createInnerCallback.js:31:19)
@ ./node_modules/@progress/kendo-react-dropdowns/dist/es/DropDownList/DropDownList.js 23:0-46
@ ./node_modules/@progress/kendo-react-dropdowns/dist/es/main.js
@ ./lib/webparts/telerikGrid/components/TelerikGrid.js
@ ./lib/webparts/telerikGrid/TelerikGridWebPart.js

[Xizario]

@jchilde , As far as I remember it was old typescript, old webpack, or old source-map-loader that Sharepoint is using internally and these errors were only in develop mode, but not in production.

The @simonssspirit has debug it once, maybe he can confirm what was the exact problem.

[simonssspirit]

@jchilde I will post the ticket response here as well:

After a research, I found that this is a common warning caused by the source-map-loader. This is why the application is working as there is nothing actually wrong with it.

All solutions are connected with modifying the webpack configuration. Please check more details here:

angular-redux/store#64

angular/angular-cli#6870

apollographql/react-apollo#597

angular/angular-cli#7115